vue项目更改element-ui主题色

方法一:使用命令行主题工具(亲测好用)

如果你的项目没有使用 SCSS,可以使用命令行主题工具进行深层次的主题定制:

1.首先安装主题生成工具

npm i element-theme -g

2.安装白垩主题

npm i element-theme-chalk -D

3.安装et

cnpm i element-themex -g

4.初始化变量文件

et -i //在命令行里输入该指令,执行后当前目录会生成一个 element-variables.scss 文件

5.修改变量:直接编辑 element-variables.scss 文件,例如修改主题色为绿色

$--color-primary: green;

6.编译主题

et //保存文件后,在命令行输入该指令,编译后的主题目录放在./theme下

7.确认main.js是否正确引用了新的css文件

1 import Vue from "vue";
2 import ElementUI from 'element-ui';
3 import '../theme/index.css'
4 import App from "./App.vue";
5 import router from "./router";