按照官网一顿操作没有效果
网上找了各种方法试了都不管用
最后发现坑在官网的一句误导
// styles/element/index.scss
/* 只需要重写你需要的即可 */
@forward 'element-plus/theme-chalk/src/common/var.scss' with (
$colors: (
'primary': (
'base': green,
),
),
);
// 如果只是按需导入，则可以忽略以下内容。
// 如果你想导入所有样式:
// @use "element-plus/theme-chalk/src/index.scss" as *;
事实证明，按需导入最后那句也不能忽略啊
@forward 'element-plus/theme-chalk/src/common/var.scss' with (
$colors: (
'primary': (
'base': green,
),
),
);
@use 'element-plus/theme-chalk/src/index.scss' as *;
搞定
没想到时隔多日还要更新一下这个问题，上面那个方法不管用的可以尝试以下解决方式
直接上代码
main.js
...
import "./assets/styles/element-theme.scss";
import ElementPlus from "element-plus";
...
注意，引用自定义主题文件element-theme.scss之后就无须再引用element-plus/dist/index.css了
element-theme.scss内容：
@forward 'element-plus/theme-chalk/src/common/var.scss' with (
$colors: (
'primary': (
'base': green,
),
),
);
@use 'element-plus/theme-chalk/src/index.scss' as *;
