vue-cli中css引入图片打包路径问题

问题

开发模式

图片路径（存储文件夹）

src|__assets|__img|__css|__js

这是我在css中引入图片的写法，在开发模式中是ok的
base.scss

$icon_url :'../img/icon.png' ;.logo{background:url('../img/login_logo.png'); }

打包后

这里就发现这个路径在css的下一级去了，那就相当于我们要在打包的时候强行给他弄到相对路径的前两级去。

解决

既然是打包问题，那我们就应该从打包配置文件去入手
config/index.js修改这句

assetsPublicPath: './',

build/utils,js加上publicPath: '../../'

return ExtractTextPlugin.extract({use: loaders,fallback: 'vue-style-loader',publicPath: '../../' })

打包

总结

以上是生活随笔为你收集整理的vue-cli中css引入图片打包路径问题的全部内容，希望文章能够帮你解决所遇到的问题。

如果觉得生活随笔网站内容还不错，欢迎将生活随笔推荐给好友。