For more information, see vue + webpack to solve the problem that the resource file cannot be found after the css referenced image is packaged,
Use vue to package and reference image resources through css.
. Img {height: 500px; width: 100%; background: url ("./assets/img/1.jpg") no-repeat; background-size: 100% ;}
This is how the hot update development environment works.
However, the error message indicating that the resource cannot be found is displayed on the page after packaging.
After checking the cause, style-loader cannot set its own publicPath after css introduces the image and then packs it. So I changed the css path publicPath of ExtractTextPlugin.
If (options. extract) {return ExtractTextPlugin. extract ({use: loaders, // css reference image Packaging Problem publicPath :'.. /.. /.. /', fallback: 'vue-style-loader'})} else {return ['vue-style-loader ']. concat (loaders )}
No error is reported during build once. It is displayed normally!
The above detailed discussion about how vue + webpack solves the problem that the resource file cannot be found after the css reference image is packaged is all the content shared by xiaobian. I hope to give you a reference, we also hope that you can support the customer's home.