关于element-plus的变量覆盖

Question

老师，我看新版的element-plus的样式都用sass:map进行组织了
文档也有说明可以通过@forward来进行变量覆盖

但是我在查阅他的变量声明文件 element-plus/theme-chalk/src/common/var.scss

他在文件中定义的是$ --color (其实没有空格的，但是没空格markdown报错了)
但在覆盖的时候说需要使用$color

我使用$–color也确实报错了

这是为什么呢？为什么 ‘-- ’要被省略呢，恳请老师指点下，最好也告知下去哪里查阅这些细节哈
麻烦老师了

Answer 1

小小小 2021-11-19 17:42:42

这就是个命名而已。不管是 $color 还是 $--color，又或者 $__color 都无所谓的，就是一个命名而已。我个人习惯不带 -- 而已，没有别的原因，你喜欢加上 --，自己可以加的。

• 提问者 有没有没被占用的昵称 #1

  不是，老师，我的意思是element声明用的是$--color，但是覆盖的不应该也用$--color进行覆盖吗？
  我用了$--color但是却显示没定义，但是用了$color就可以。
  这是为什么呢

• 小小小 回复 提问者 有没有没被占用的昵称 #2

  ElementPlus 申明就是用的 $color，所以 $color 就可以覆盖呀：
  https://github.com/element-plus/element-plus/blob/dev/packages/theme-chalk/src/common/var.scss
  
  Element2.x 的申明用的 $--color，所以 $--color 就可以覆盖：
  https://github.com/ElemeFE/element/blob/dev/packages/theme-chalk/src/common/var.scss
  
  这是不同版本的 Element，你是不是看串了

• 提问者 有没有没被占用的昵称 #3

  非常感谢！

点开查看后面1条评论