首页 > 其他 > 详细

vue采坑:vue项目打包后,elementUI 部分样式失效

时间:2020-05-20 11:15:28      阅读:206      评论:0      收藏:0      [点我收藏+]

最近在搭建一个vue+ElementUI+Vuex项目,打包时发现了有几个问题,解决后特地记录一下,以免下一次有遇到类似的问题。

一.页面一片空白并报错Failed to load resource: net::ERR_FILE_NOT_FOUND 

第一次打包后发现页面一片空白,并且报错Failed to load resource: net::ERR_FILE_NOT_FOUND 

技术分享图片

 

 

然后上网发现更改一下配置就行了。

1.webpack.prod.conf.js 中output添加参数publicPath:‘./‘

技术分享图片

 

 

 

 2.修改webpack.base.conf.js中:

publicPath: process.env.NODE_ENV === production

? ./ +config.build.assetsPublicPath

: ./ + config.dev.assetsPublicPath

 

技术分享图片

 

 

3.如果还有问题:找到config文件里面的index.js文件
修改build里面的assetsPublicPath;

技术分享图片

 

 我是第三步本来就已经是这样设置的所以,第三步没有更改。

然后打包,页面就不再是一片空白了。

但是有出现了新的问题,发现部分Element UI 样式失效,如下图,icon变成方框了

技术分享图片

 

 解决办法:在build文件夹下找到utils.js,加上一行publicPath:‘../../‘

 技术分享图片

 

然后再打包,打开index.html文件就能看到图标正常显示啦。

技术分享图片

 

vue采坑:vue项目打包后,elementUI 部分样式失效

原文:https://www.cnblogs.com/yjiangling/p/12922314.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!