elementUI自定义主题

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/linggty/article/details/90039132

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'

大功告成

猜你喜欢

转载自blog.csdn.net/linggty/article/details/90039132
今日推荐