Vuejs图片编译后失败的问题

问题： (vue.js)vue-cli 打包之后图片引用路径；
描述:
这是我的组件的路径；
./src/components/home目录下；

image.png

图片的路径：
./static/img目录下；

image.png

当我在开发的时候，引用图片的时候路径需要这样写（home组件中引用图片）：

image.png

我需要回退两个路径才可可以访问到./static/img下的图片；
问题：
当我npm run build 之后；生成的html中；home组件引用的图片路径也会回退两个路径；这样就报错了；
打包之后的图片地址不用回退两个路径，因为他们就在./static/img目录下，html文件和static是同级目录；

image.png image.png

栗子：
这是我在home文件中引用的背景图片的地址：

image.png

右键在新网页打开图片的路径：

image.png
beta/static/css/static/img/.jpg
正确的路径应该是：
beta/static/img/.jpg;
这里被加上了/static/css，不知道怎么回事。
webpack的配置中： image.png

这个是怎么打包的。。。。

image.png

解决方案1:
把你的图片资源放到static文件下，不论你是在vue文件中，还是在css文件中都这样使用：
![](/static/img/...)
background:url('/static/img/...)
这样打包之后就不会出现图片路径错误了，否则vue-cli不会给你一个static文件夹啊，是不是