vue项目打包问题汇总

vue项目打包问题汇总

打包命令是npm run build，这个命令实际上是在package.json中，scripts中build所对应的命令。

常见问题一、静态资源加载不出来报错Failed to load resource: net::ERR_FILE_NOT_FOUND

解决方法：图片的相对路径问题，要引用相对路径下的图片，首先是在config/index.js中，将build.assetsPublicPath改为'./'，原来是'/'，

常见问题二、报错Cannot GET /

解决方法：配置问题，在config/index.js中，将dev.assetsPublicPath改为'/'，原来是'/'，可能被改为'./',这是不对的。

常见问题三、写在css上的背景图加载不出来，而直接用img标签加载的图片却出来了。

解决方法：配置build/utils.js,在return ExtractTextPlugin.extract里面加上一句publicPath:'../../'，如下图

常见问题四、图片加载不出来，报错206

解决方法：服务器配置编码问题，这个一般后端同学配置下就可以了

常见问题五、使用iview开发的话，打包之后，直接打开index.html之后会报错，有字体文件引入失败

解决办法：在webpack.prod.conf.js中设置module.rules中的extract为false，如下图