在App.vue的 <style>中加一个background: url('./asssets/images/xxx.png')之类相对路径引用的样式
此时进行打包命令
你会发现提取出来的 css 中 url() 中图片的路径是 static/img/xxx.png 这样的,用浏览器打开index.html将会有 xxxxxxx/static/css/static/img/xxx.png 这个图片 404 的报错
主要是需要单独为 css 配置 publicPath ,更改 build/utils.js 文件中 ExtractTextPlugin 插件的 options 配置：
做项目的时候，突然发现一个容易犯错的问题
1、webpack中对css文件的处理使用的是： MiniCSSExtractPlugin、css-loader、post-loader。
2、在plugins中也相对应的设置一个MiniCssExtractPlugin，打包后将css文件单独抽离到了css文件夹下
3、打包后的目录
4、打包后的css里面的url
6、再次打包，url引入正确
很简单，但是如果不注意，还真的很容易掉坑里！！
../12/images/10.gif用的是相对路径，这个路径是该css文件的上一级目录中的12这个文件夹里面的images文件夹里面的10.gif这张图片
你可以对照查看一下该图片是否存在
希望对lz有帮助
