Новый способ импортирования компонентов из element-ui,

теперь с динамической загрузкой

client/element.js

@@ -1,5 +1,6 @@
 import Vue from 'vue';
 
+
 /*
 import ElementUI from 'element-ui';
 import './theme/index.css';
@@ -9,141 +10,47 @@ Vue.use(ElementUI, { locale });
 */
 
 //------------------------------------------------------
-import locale from 'element-ui/lib/locale/lang/ru-RU';
+//import './theme/index.css';
 
-import {
+import './theme/icon.css';
-//  Pagination,
+import './theme/tooltip.css';
-//  Dialog,
-//  Autocomplete,
-//  Dropdown,
-//  DropdownMenu,
-//  DropdownItem,
-  Menu,
-//  Submenu,
-  MenuItem,
-/*  MenuItemGroup,
-  Input,
-  InputNumber,
-  Radio,
-  RadioGroup,
-  RadioButton,
-  Checkbox,
-  CheckboxButton,
-  CheckboxGroup,
-  Switch,
-  Select,
-  Option,
-  OptionGroup,*/
-  Button,
-/*  ButtonGroup,
-  Table,
-  TableColumn,
-  DatePicker,
-  TimeSelect,
-  TimePicker,
-  Popover,
-  Tooltip,
-  Breadcrumb,
-  BreadcrumbItem,
-  Form,
-  FormItem,*/
-  Tabs,
-  TabPane,
-  /*Tag,
-  Tree,
-  Alert,
-  Slider,
-  Icon,
-  Row,
-  Col,
-  Upload,
-  Progress,
-  Badge,
-  Card,
-  Rate,
-  Steps,
-  Step,
-  Carousel,
-  CarouselItem,
-  Collapse,
-  CollapseItem,
-  Cascader,
-  ColorPicker,
-  Transfer,*/
-  Container,
-//  Header,
-  Aside,
-  Main,
-//  Footer,
-//  Loading,
-//  MessageBox,
-//  Message,
-  Notification
-} from 'element-ui';
 
-//Vue.use(Pagination);
+import ElMenu from 'element-ui/lib/menu'; 
-//Vue.use(Dialog);
+import './theme/menu.css';
-//Vue.use(Autocomplete);
+
-//Vue.use(Dropdown);
+import ElMenuItem from 'element-ui/lib/menu-item';
-//Vue.use(DropdownMenu);
+import './theme/menu-item.css';
-//Vue.use(DropdownItem);
+
-Vue.use(Menu);
+import ElButton from 'element-ui/lib/button';
-//Vue.use(Submenu);
+import './theme/button.css';
-Vue.use(MenuItem);
+
-/*Vue.use(MenuItemGroup);
+const ElTabs = () => import('element-ui/lib/tabs');
-Vue.use(Input);
+import './theme/tabs.css';
-Vue.use(InputNumber);
+
-Vue.use(Radio);
+const ElTabPane = () => import('element-ui/lib/tab-pane');
-Vue.use(RadioGroup);
+import './theme/tab-pane.css';
-Vue.use(RadioButton);
+
-Vue.use(Checkbox);
+import ElContainer from 'element-ui/lib/container';
-Vue.use(CheckboxButton);
+import './theme/container.css';
-Vue.use(CheckboxGroup);
+
-Vue.use(Switch);
+import ElAside from 'element-ui/lib/aside';
-Vue.use(Select);
+import './theme/aside.css';
-Vue.use(Option);
+
-Vue.use(OptionGroup);*/
+import ElMain from 'element-ui/lib/main';
-Vue.use(Button);
+import './theme/main.css';
-/*Vue.use(ButtonGroup);
+
-Vue.use(Table);
+const ElNotification = () => import('element-ui/lib/notification');
-Vue.use(TableColumn);
+import './theme/notification.css';
-Vue.use(DatePicker);
+
-Vue.use(TimeSelect);
+const components = {
-Vue.use(TimePicker);
+    ElMenu, ElMenuItem, ElButton, ElTabs, ElTabPane,
-Vue.use(Popover);
+    ElContainer, ElAside, ElMain,
-Vue.use(Tooltip);
+    ElNotification
-Vue.use(Breadcrumb);
+};
-Vue.use(BreadcrumbItem);
+
-Vue.use(Form);
+for (let [name, comp] of Object.entries(components)) {
-Vue.use(FormItem);*/
+    Vue.component(name, comp);
-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(Badge);
-Vue.use(Card);
-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.use(Transfer);*/
-Vue.use(Container);
-//Vue.use(Header);
-Vue.use(Aside);
-Vue.use(Main);
-//Vue.use(Footer);
 
 //Vue.use(Loading.directive);
 
@@ -155,4 +62,5 @@ Vue.use(Main);
 Vue.prototype.$notify = Notification;
 //Vue.prototype.$message = Message;
 
-Vue.prototype.$ELEMENT = { locale };
+import locale from 'element-ui/lib/locale/lang/ru-RU';
+Vue.prototype.$ELEMENT = { locale };