elementUI自定义主题

elementUI自定义主题

第一步 安装主题工具

npm i element-theme -g

第二步 安装chalk主题

npm i element-theme-chalk -D

第三步 初始化变量文件

et -i

这时根目录会生成element-variables.scss文件
第四步 修改变量
直接编辑element-variables.scss文件 例如修改主题色为红色，在element-variables.scss中找到

$--color-primary: #409EFF !default;

改为

$--color-primary: red !default;

第四步 编译主题

每次修改都需要编译一次

et

第五步 引入自定义主题

将编译好的主题文件引入项目（编译的文件默认在根目录下的theme文件夹下），在main.js中引入

import '../theme/index.css'

大功告成