vuecli+elementUI修改主题色element-variables.scss

安装element-ui

npm i element-ui

全局安装主题【如果下面的et执行出错,就使用cnpm安装】

npm i element-theme -g

.安装白垩主题【我是在node目录的global安装成功的,不知道为啥没有全局的et命令】

npm i element-theme-chalk -D

编译主题【自动生成element-variables.scss

et -i

再把生成的scss文件复制到工程项目的src目录下,然后需要替换element-ui的默认主题文件:即

import ElementUI from "element-ui";
// import "element-ui/lib/theme-chalk/index.css";
import "./assets/css/element-variables.scss";

然后修改element-variables.scss文件的主题样式,记得在其末尾加上:不能写在前面,否则自定义无效

/* 改变 icon 字体路径变量,必需 */
$--font-path: '~element-ui/lib/theme-chalk/fonts';

@import "~element-ui/packages/theme-chalk/src/index";
  • 1
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值