feat: element-ui主题色修改

babel.config.js

@@ -3,12 +3,13 @@ module.exports = {
     '@vue/cli-plugin-babel/preset'
   ],
   plugins: [
-    [
-      'component',
-      {
-        libraryName: 'element-ui',
-        styleLibraryName: 'theme-chalk'
-      }
-    ]
+    // element-ui简单的修改主题色和按需引入冲突，此处关闭按需引入
+    // [
+    //   'component',
+    //   {
+    //     libraryName: 'element-ui',
+    //     styleLibraryName: 'theme-chalk'
+    //   }
+    // ]
   ]
 }

src/assets/style/element-variables.scss

@@ -0,0 +1,8 @@
+/* 改变主题色变量 */
+$--color-primary: #2CB7CA;
+$--color-font: #1D1D1D;
+
+/* 改变 icon 字体路径变量，必需 */
+$--font-path: '~element-ui/lib/theme-chalk/fonts';
+
+@import "~element-ui/packages/theme-chalk/src/index";

src/main.js

@@ -4,7 +4,8 @@ import './registerServiceWorker'
 import './brace/register'
 import router from './router'
 import store from './store'
-import { Message, MessageBox, Loading } from 'element-ui'
+import '@/assets/style/element-variables.scss'
+import ElementUI, { Message, MessageBox, Loading } from 'element-ui'
 import '@/utils'
 import Toast from '@/utils/toast/'
 import $bus from './utils/bus'
@@ -14,6 +15,7 @@ Vue.prototype.$alert = MessageBox.alert
 Vue.prototype.$confirm = MessageBox.confirm
 Vue.use(Loading.directive)
 Vue.use(Toast)
+Vue.use(ElementUI)
 Vue.config.productionTip = false
 const vm = new Vue({
   router,