scss/less修改vant/element ui的默认样式方法

Posted 2023-03-15

参考技术A

在Vue的项目中，style的样式都会增加 scoped 标识当前样式只影响当前页面组件，通常也会使用像Element UI和 Vant UI组件库，这就涉及到了如何修改默认组件样式的问题了。

1.在不使用css预处理器的情况，使用 >>> ，改变默认组件样式（以Vant UI为例子）

2.在使用less的情况下，使用 ::v-deep 或 /deep/ ，改变默认样式。

3.在使用scss的情况下，要使用 ::v-deep ， /deep/ 反而会报错（可能是不支持？）。

附录：顺带一提，scss和less预处理器是可以使用css变量的， scss使用的是$变量名 ， less使用的是@变量名 。