elementui 按需引入

admin/package.json

@@ -27,6 +27,7 @@
     "babel-eslint": "^8.2.1",
     "babel-helper-vue-jsx-merge-props": "^2.0.3",
     "babel-loader": "^7.1.1",
+    "babel-plugin-component": "^1.1.1",
     "babel-plugin-syntax-jsx": "^6.18.0",
     "babel-plugin-transform-runtime": "^6.22.0",
     "babel-plugin-transform-vue-jsx": "^3.5.0",

admin/src/element.js

@@ -0,0 +1,104 @@
+// element引入列表
+//完整组件参照 : https://github.com/ElemeFE/element/blob/master/components.json
+import Vue from 'vue';
+import 'element-ui/lib/theme-chalk/index.css';
+import './assets/scss/element-variables.scss';
+import {
+  Aside,
+  Backtop,
+  Badge,
+  Button,
+  ButtonGroup,
+  Card,
+  Container,
+  Divider,
+  Dropdown,
+  DropdownItem,
+  DropdownMenu,
+  Footer,
+  Header,
+  Input,
+  Loading,
+  Main,
+  Message,
+  MessageBox,
+  Notification,
+  Scrollbar,
+  Transfer
+} from 'element-ui';
+
+Vue.use(Backtop);
+Vue.use(Dropdown);
+Vue.use(DropdownItem);
+Vue.use(Button);
+Vue.use(ButtonGroup);
+Vue.use(Badge);
+Vue.use(Card);
+Vue.use(Transfer);
+Vue.use(Container);
+Vue.use(Header);
+Vue.use(Aside);
+Vue.use(Main);
+Vue.use(Footer);
+Vue.use(Scrollbar);
+Vue.use(Divider);
+Vue.use(Loading.directive);
+Vue.use(DropdownMenu);
+Vue.use(Input);
+// Vue.use(Pagination);
+// Vue.use(Dialog);
+// Vue.use(Autocomplete);
+// Vue.use(Menu);
+// Vue.use(Submenu);
+// Vue.use(MenuItem);
+// Vue.use(MenuItemGroup);
+// Vue.use(InputNumber);
+// Vue.use(Radio);
+// Vue.use(RadioGroup);
+// Vue.use(RadioButton);
+// Vue.use(Checkbox);
+// Vue.use(CheckboxButton);
+// Vue.use(CheckboxGroup);
+// Vue.use(Switch);
+// Vue.use(Select);
+// Vue.use(Option);
+// Vue.use(OptionGroup);
+// Vue.use(Table);
+// Vue.use(TableColumn);
+// Vue.use(DatePicker);
+// Vue.use(TimeSelect);
+// Vue.use(TimePicker);
+// Vue.use(Popover);
+// Vue.use(Tooltip);
+// Vue.use(Breadcrumb);
+// Vue.use(BreadcrumbItem);
+// Vue.use(Form);
+// Vue.use(FormItem);
+// Vue.use(Tabs);
+// Vue.use(TabPane);
+// Vue.use(Tag);
+// Vue.use(Tree);
+// Vue.use(Alert);
+// Vue.use(Slider);
+// Vue.use(Icon);
+// Vue.use(Row);
+// Vue.use(Col);
+// Vue.use(Upload);
+// Vue.use(Progress);
+// Vue.use(Rate);
+// Vue.use(Steps);
+// Vue.use(Step);
+// Vue.use(Carousel);
+// Vue.use(CarouselItem);
+// Vue.use(Collapse);
+// Vue.use(CollapseItem);
+// Vue.use(Cascader);
+// Vue.use(ColorPicker);
+
+Vue.prototype.$loading = Loading.service;
+Vue.prototype.$msgbox = MessageBox;
+Vue.prototype.$alert = MessageBox.alert;
+Vue.prototype.$confirm = MessageBox.confirm;
+Vue.prototype.$prompt = MessageBox.prompt;
+Vue.prototype.$notify = Notification;
+Vue.prototype.$message = Message;

admin/src/main.js

@@ -3,23 +3,20 @@
 import Vue from 'vue'
 import App from './App'
 import router from './router'
-import ElementUI from 'element-ui';
+import './element'
 import axios from 'axios';
 import VueAxios from 'vue-axios';
 import "babel-polyfill";
 import './assets/css/reset.css';
 import './assets/css/bootstrap.css';
 import './assets/scss/glob.scss';
-import 'element-ui/lib/theme-chalk/index.css';
-import './assets/scss/element-variables.scss';
-import Glob from './assets/js/glob.js';
+import glob from './assets/js/glob.js';
 
 //use
 Vue.config.productionTip = false;
-Vue.use(ElementUI);
 Vue.use(VueAxios, axios);
 //init
-Glob.inti();
+glob.inti();
 /* eslint-disable no-new */
 new Vue({
   el: '#app',