直接使用iview官方的覆盖大概率都要报错,比如:
说多了都是泪(•́へ•́╬)
所以经过我踩了一晚上的坑之后,测试出了如下的东西
1.各插件版本
// iview版本
"view-design": "^4.6.1",
// 自定义主题插件
"iview-theme": "^1.1.0",
// less版本
"less": "^4.1.1",
"less-loader": "^6.0.0",
2.vue.config.js
//增加内容
module.exports = {
css: {
loaderOptions: {
less: {
lessOptions: {
javascriptEnabled: true,
},
},
},
},
}
3.在全局样式中引入index.less
// index.less 此文件要在main.js中引入
@import '~view-design/src/styles/index.less';
@primary-color: #6682ef;
4.项目重新安装,重新启动即可
5.其他
当然我我使用过降低less版本配置的方式
// less版本
"less": "^2.7.31",
"less-loader": "^5.0.0",
这个配置也是一样可以生效的修改成功的,但是一改成这个配置项目的启动跟热刷新瞬间慢了好几倍,并且伴随着一些新css3样式写法不兼容问题以及无法使用@路径等等。
更多报错请参考这篇文章