按需引入
借助 babel-plugin-component，我們可以只引入需要的組件，以達(dá)到減小項(xiàng)目體積的目的。
首先陷嘴，安裝 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",
["es2015", { "modules": false }]
],
"plugins": [
"transform-runtime",
"transform-vue-jsx",
["component", [
{
"libraryName": "element-ui",
"styleLibraryName": "theme-chalk"
}
]]
],
"env": {
"test": {
"presets": ["env", "stage-2"],
"plugins": ["istanbul"]
}
}
接下來摔竿，如果你只希望引入部分組件，比如 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)
});
