vue-cli按需引入Element UI组件

一、环境

　　使用vue-cli搭建的环境

二、安装 babel-plugin-component

　　npm install babel-plugin-component -D

三、修改.babelrc文件，可以直接拷贝一下的配置，红色部分是在原来基础上添加的。

{
  "presets": [
    ["env", {
      "modules": false,
      "targets": {
        "browsers": ["> 1%", "last 2 versions", "not ie <= 8"]
      }
    }],
    "stage-2"
  ],
  "plugins": [
    "transform-vue-jsx",
    "transform-runtime",
14     [
15       "component",
16       {
17         "libraryName": "element-ui",
18         "styleLibraryName": "theme-chalk"
19       }
20     ]
  ],
  "env": {
    "test": {
      "presets": ["env", "stage-2"],
      "plugins": ["transform-vue-jsx", "transform-es2015-modules-commonjs", "dynamic-import-node"]
    }
  }
}

四、在main.js文件添加所需的组件即可，例如添加Button组件；详情请看Element UI 官网

import { Button} from 'element-ui'

Vue.use(Button)