vue项目部署前打包
vue项目打包上线之前要进行相应的配置,否则会存在路径找不到,页面出现空白的问题,现在做一下记录
1、打包成功没有报错,但是打开页面显示空白
解决:文件位置:config目录下index.js文件更改assetsPublicPath属性:文件里面有两个assetsPublicPath属性,也就是更改build里面的assetsPublicPath属性:(加上点)
assetsPublicPath:'/'替换成assetsPublicPath:'./'
2、打包成功没有报错,但是打开页面ico图标不显示
解决:文件位置:build目录下utils.js文件中fallback后边添加publicPath: '../../'
if (options.extract) {
return ExtractTextPlugin.extract({
use: loaders,
fallback: 'vue-style-loader',
})
} else {
return ['vue-style-loader'].concat(loaders)
}
3、打包完成后某些图片没加载出来,f12提示404,且dist文件下的static文件夹下有一个img文件夹
原因:图片过大或者资源文件过大、超过了打包规定的限制;
解决:修改build目录下面的webpack.base.conf.js文件下的limit限制,超过你使用到的最大图片资源即可。
4、打包后运行项目:刷新界面会出现404
解决:router目录下的index.js文件,mode: 'history',//将这个模式关闭就好
5、运行npm run build就会生成dist文件夹,也就是打包好的文件
(本人目前只遇到上述三种情况,如遇其他情况,请参考https://blog.csdn.net/weixin_42103706/article/details/100319474?utm_medium=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-2.channel_param&depth_1-utm_source=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-2.channel_param,感谢分享)

浙公网安备 33010602011771号