关于 element 的使用和按需导入的使用总结

1. element的项目导入 导入方式参考官网

npm i element-ui -S

2. element的全局使用，同样可以参考Element官网的导入方式，但是实际开发过程没必要导入全部的element组 件，所以需要按需导入
3. element 的按需导入方式
   官网的导入方式：
   首先安装导入babel-plugin-component

npm install babel-plugin-component -D

创建.babelrc并修改配置如下：

 { 
     "presets": [["es2015", { "modules": false }]], 
     // 自己服务中加上 `presets` 会报 `es2015` 相关的错，后面删除注释 `presets` 之后就正常了
     "plugins": [ 
         [ 
             "component", 
             { 
                 "libraryName": "element-ui", 
                 "styleLibraryName": "theme-chalk" 
              } 
          ] 
       ] 
   }

前面的和官网的差不多，后面的是网上看到的一种方式，统一引入调用比较方便。
创建 element-config.js 配置文件：

import {
  Tabs,
  TabPane,
  Steps,
  Step
} from 'element-ui'

export default {
  install (V) {
    V.use(Tabs)
    V.use(TabPane)
    V.use(Steps)
    V.use(Step)
  }
}

在 main.js 中修改如下：

import ElementUI from "./element-config";
import "@/assets/css/element-variables.scss";

Vue.use(ElementUI);

针对自定义场景下的element样式复用可以直接在element-variables.scss中统一导入覆盖