一,安裝sass
1 npm i sass sass-loader --save
二,安裝element主題生成工具
// 全局安裝
npm i element-theme --save
// 安裝主體工具,注意沒全局裝 npm i element-theme -D
三,安裝chalk主題
1 npm i element-theme-chalk -D
初始化變量文件 (如果第二步是全局安裝執行1,如果第二步是局部安裝執行2)
1. 全局安裝,在根目錄下,打開git命令工具
,輸入et -i
在根目錄下面,會自動生成 element-variables.scss 文件
2. 沒有全局安裝,所以要換個命令 ./node_modules/element-theme/bin/element-theme -i
./node_modules/element-theme/bin/element-theme -i
執行初始化命令,在項目根目錄生成element-variables.scss
3,修改css變量(每次修改都要執行)
假設我要把 button 中primary類型的背景顏修改為紅色
修改完成之后,在git命令工具中輸入 et 或者是
./node_modules/element-theme/bin/element-theme 參考 1,2 步驟
編譯完成后,會在本地根目錄生成 theme 文件夾
4. 在main.js中引入 編譯過的index.css
然后引入自定義主題