5分钟自己生成elementUI-theme

745 阅读1分钟

问题:elementUI官方theme生成工具503错误,无法生成theme

解决方案

1. 安装element-themex和element-theme-chalk

npm i element-themex和 -D
npm i element-theme-chalk -D

2. package.json增加cli命令

"scripts": {
    "init": "et --init"
},

3.生成element-variables.scss文件

 npm run init

4. 新建一个create-theme.js

var et = require('element-themex')

et.run({
    "browsers": ["ie > 9", "last 2 versions"],  // 浏览器兼容性
    "out": "./theme",  // 输出的文件
    "config": "./element-variables.scss",  // elementUI主题颜色的配置文件
    "theme": "element-theme-chalk",
    "minimize": true, // 是否压缩
    "components": ["button", "input"] // 应用的组件 不写就是全部组件
})

5. 在element-variables.scss文件里修改颜色

6. node create-theme.js

7. 获得theme文件,把文件中的index.css放到具体项目里即可实现theme修改