方法一：使用命令行主題工具（親測好用）
如果你的項目沒有使用 SCSS，可以使用命令行主題工具進行深層次的主題定制：
1.首先安裝主題生成工具
npm i element-theme -g
2.安裝白堊主題
npm i element-theme-chalk -D
3.初始化變量文件
et -i //在命令行里輸入該指令，執行后當前目錄會生成一個 element-variables.scss 文件
4.修改變量：直接編輯 element-variables.scss 文件，例如修改主題色為綠色
$--color-primary: green;
5.編譯主題
et //保存文件后，在命令行輸入該指令，編譯后的主題目錄放在./theme下
6.確認main.js是否正確引用了新的css文件
1 import Vue from "vue";
2 import ElementUI from 'element-ui'; 3 import '../theme/index.css' 4 import App from "./App.vue"; 5 import router from "./router";
7.重啟項目，便能看到主題色已經修改好啦~
方法二：在項目中改變SCSS變量
Element 的 theme-chalk 使用 SCSS 編寫，如果你的項目使用了 SCSS，那么可以直接在項目中改變 Element 的樣式變量。新建一個樣式文件，例如 element-variables.scss，寫入以下內容：
/* 改變主題色變量 */
$--color-primary: teal; /* 改變 icon 字體路徑變量，必需 */ $--font-path: '~element-ui/lib/theme-chalk/fonts'; @import "~element-ui/packages/theme-chalk/src/index";
之后，在項目的入口文件中，直接引入以上樣式文件即可（無需引入 Element 編譯好的 CSS 文件）：
需要注意的是，覆蓋字體路徑變量是必需的，將其賦值為 Element 中 icon 圖標所在的相對路徑即可。
import Vue from 'vue'
import Element from 'element-ui' import './element-variables.scss' Vue.use(Element)