引入 Element分為完整引入和按需引入
完整引入：
在 main.js 中寫入以下內(nèi)容：
import Vue from 'vue';
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
import App from './App.vue';
Vue.use(ElementUI);
new Vue({
el: '#app',
render: h => h(App)
});
以上代碼便完成了 Element 的引入。需要注意的是材彪，樣式文件需要單獨(dú)引入跨细。
按需引入
借助babel-plugin-component垛耳，我們可以只引入需要的組件涩赢，以達(dá)到減小項目體積的目的。
首先馆里，安裝 babel-plugin-component：
npm install babel-plugin-component -D
然后隘世，將 .babelrc 修改為：
{
"presets": [["es2015", { "modules": false }]],
"plugins": [
[
"component",
{
"libraryName": "element-ui",
"styleLibraryName": "theme-chalk"
}
]
]
}
接下來，如果你只希望引入部分組件鸠踪，比如 Button 和 Select丙者，那么需要在 main.js 中寫入以下內(nèi)容：
import Vue from 'vue';
import { Button, Select } from 'element-ui';
import App from './App.vue';
Vue.component(Button.name, Button);
Vue.component(Select.name, Select);
/* 或?qū)憺? * Vue.use(Button)
* Vue.use(Select)
*/
new Vue({
el: '#app',
render: h => h(App)
});
全局配置
在引入 Element 時，可以傳入一個全局配置對象慢哈。該對象目前支持 size 與 zIndex 字段蔓钟。size 用于改變組件的默認(rèn)尺寸，zIndex 設(shè)置彈框的初始 z-index（默認(rèn)值：2000）卵贱。按照引入 Element 的方式滥沫，具體操作如下：
完整引入 Element：
import Vue from 'vue';
import Element from 'element-ui';
Vue.use(Element, { size: 'small', zIndex: 3000 });
按需引入 Element：
import Vue from 'vue';
import { Button } from 'element-ui';
Vue.prototype.$ELEMENT = { size: 'small', zIndex: 3000 };
Vue.use(Button);
按照以上設(shè)置侣集，項目中所有擁有 size 屬性的組件的默認(rèn)尺寸均為 'small'，彈框的初始 z-index 為 3000兰绣。
