修改element-ui主题颜色

方法1:创建一个公共的更改的CSS文件,在CSS文件里写入
$–color-primary:加颜色,最后在main.js中引入

方法2:借助在线主题生成工具,设置自己想要的颜色,下载主题,解压之后,在main.js 中引入

方法3:安装主题工具

1、安装主题工具

npm i element-theme -g  //安装主题工具

2、从 npm 安装theme

npm i element-theme-chalk -D 

3、初始化变量文件

et -i [可以自定义变量文件,默认为element-variables.scss]

4、根目录下会产生element-variables.scss(或自定义的文件),把你下载的element-variables.scss中的

$--color-primary: #409EFF  // 修改想要的颜色

5、编译主题修改完变量后,要编译主题(如果编译后,再次修改了变量,需要重新编译)

et  //编辑主题

6、引入自定义主题最后一步,将编译好的主题文件引入项目(编译的文件默认在根目录下的theme文件下,也可以通过 -o 参数指定打包目录),在入口文件main.js中引入

你可能感兴趣的:(javascript,vue.js,前端)