element主题更换详解
准备工作
初始化一个vue项目
vue init webpack element-theme
npm install
npm run dev安装并引入element
npm install element-ui --save
main.js
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
Vue.use(ElementUI);主题生成工具安装
全局安装
npm install element-theme -g安装chalk主题
npm
npm install element-theme-chalk -D
GitHub
npm install https://github.com/ElementUI/theme-chalk -D初始化变量文件
执行-i初始化变量文件，默认输出到element-variables.scss
et -i [自定义变量文件]
> ✔ Generator variables file执行后会有一个scss配置文件element-variables.scss，内部包含了主题所用到的所有变量
修改变量
直接编辑 element-variables.scss 文件，例如修改主题为想要的颜色。
$--color-primary: #34a853 !default;编译主题
et
> ✔ build theme font
> ✔ build element theme引入主题文件
import '../theme/index.css'测试
测试成功
本文参与 腾讯云自媒体分享计划，分享自作者个人站点/博客。
原始发表：2018.06.08 ，如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读
目录