样式不一致可以从一下几点逐一排查
1.
页面里面使用其他样式组件, 要大量修改element里面的css样式,所以项目打包之后
会出现样式和本地开发的时候样式有很多不一样,原因可能是css加载顺序有问题,样式被覆改了。
所以在mian.js里面这样修改:
‘./APP’和’./router’放在element css的后面,router放到最后
还有就是每个vue组件里的style要加scoped,这很关键,起到css不被组件之间重叠的作用。
2.
1点击F12查看服务器上的页面样式与本地样式是否一致
2在本地查看打包的样式是否与服务器上一致
遇到的问题:
页面中引用了element样式,根据需求修改下拉框组件的样式,但是与scoped不能一起使用,我就没有使用scoped,做第一个页面的时候没有任何问题
当第二个页面出现的时候,使用npm run dev 启动的时候在本地没有任何问题,但是在build打包之后两个页面使用的同样的样式名称的地方开始冲突,代码样式就在这里开始变化
后来把scoped 在页面加上,把element修改的样式单独提出来引用就好了