vue小技巧之偷懒的文件路径——减少不必要的代码

时间:2022-09-14 08:05:47

  众所周知,我们写vue项目的时候都会创建很多个文件,尤其是一些中大型项目,会有很深的文件夹,当你去引入的时候,要写很长的路径比如我要引入一个css文件,

必须得  import  '../../../styles/iconfont.css'  ,文件放的越深,路径就越长,所以我来说一个小技巧。

  当我们刚开始创建好vue项目的时候看到一些文件引入的前面有一个@符号,这个符号的意义是什么呢?

  我们打开build文件下的webpack.base.conf.js,用Ctrl+f搜索@,找到之后你会看到  '@': resolve('src'),这个@就是自定义的别名,保存的是src路径,所以@就是src路径,

看到这里,小伙伴们应该知道接下来这么做了吧,'自定义别名' : resolve('你经常引用的路径'),  就以我的路径为例子,我创建的别名是styles,所以我要引入iconfont.css

就得这么写,import 'styles/iconfont.css',然后再从新启动项目,记得,一定要重新启动项目,不然会报错的!!!!!!!!!

  vue小技巧之偷懒的文件路径——减少不必要的代码