vue+ElementUI改变主题色
2018-07-25 本文已影响259人
hsqin
背景介绍:项目使用vue.js+elementUI+scss,但是项目的主题色要修改为紫色。Mac电脑,且已安装过npm。
我使用的是全局安装(-g),官方文档说是建议安装在项目中
全局安装步骤
cd element-demo
npm i element-theme -g
npm i element-theme-chalk -D
et -i
修改scss中的颜色值
et
main.js修改引入
步骤说明
-
进入项目文件夹
cd element-demo
-
安装主题生成工具
npm i element-theme -g
-
安装白垩主题(不可以省略)
npm i element-theme-chalk -D
-
改变初始变量文件
et -i
,会在根目录下多出一个element-variables.scss
文件 -
找到
element-variables.scss
文件,修改主题色变量(primary
)和其他要改变的颜色(eg:danger
)
修改primary和danger色值.png
-
编译主题
et
-
引入自定义主题,保存后,就可以看到颜色已变为了你设置的颜色
引入自定义主题.png
