使用背景
在vue的项目中需要使用到 某一个路径的图片,但是用相对路径和绝对路径书写起来都会是很长的路径
例如:
./../../../static/img/my/icon4.png
甚至更长
这种情况下,想要我们的路径书写简短一点 ,就可以使用 ‘@/
’ 、 ‘~@/
’ 来表示前面部分的路径。
@/
也是相对路径 和 ./
意思差不多,具体表示什么路径需要看具体的@
如何配置
.
如何配置:
首先需要现在项目里面的 build/webpack.base.conf.js
文件里面 找到 resolve
对象
如下:
![在这里插入图片描述](https://img-blog.csdnimg.cn/20190605110432663.png)
具体步骤代码如下:
![在这里插入图片描述](https://img-blog.csdnimg.cn/20190605110453436.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDUxNDY2NQ==,size_16,color_FFFFFF,t_70)
然后使用:
![在这里插入图片描述](https://img-blog.csdnimg.cn/20190605110513122.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDUxNDY2NQ==,size_16,color_FFFFFF,t_70)
最后运行即可! ^._.^