Просмотр исходного кода

perf(web): replace full Element UI import with selective imports

35 components imported individually for tree-shaking. Build output reduced from ~3MB to ~1.8MB vendor chunk.
Xiaogang Liao 2 месяцев назад
Родитель
Сommit
85864fb4ae
1 измененных файлов с 58 добавлено и 2 удалено
  1. 58 2
      cfc-web/src/main.js

+ 58 - 2
cfc-web/src/main.js

@@ -2,11 +2,67 @@ import Vue from 'vue'
 import App from './App.vue'
 import router from './router'
 import store from './store'
-import ElementUI from 'element-ui'
+import {
+  Button, Table, TableColumn, Form, FormItem, Input, Select, Option, Dialog,
+  Pagination, Tag, Card, Col, Row, Icon, Descriptions, DescriptionsItem,
+  Radio, RadioGroup, Switch, Checkbox, CheckboxGroup, Dropdown,
+  DropdownMenu, DropdownItem, DatePicker, Upload, Tabs, TabPane,
+  Menu, Submenu, MenuItem, Empty, Drawer, Timeline, TimelineItem,
+  Progress, Container, Header, Aside, Main, Avatar, Scrollbar, Divider,
+  Tab, Badge, Tree, ColorPicker, Tooltip, Popover
+} from 'element-ui'
 import 'element-ui/lib/theme-chalk/index.css'
 import { formatPrice, formatPriceWithSymbol, formatRate, formatScore } from './utils/format'
 
-Vue.use(ElementUI)
+Vue.use(Button)
+Vue.use(Table)
+Vue.use(TableColumn)
+Vue.use(Form)
+Vue.use(FormItem)
+Vue.use(Input)
+Vue.use(Select)
+Vue.use(Option)
+Vue.use(Dialog)
+Vue.use(Pagination)
+Vue.use(Tag)
+Vue.use(Card)
+Vue.use(Col)
+Vue.use(Row)
+Vue.use(Icon)
+Vue.use(Descriptions)
+Vue.use(DescriptionsItem)
+Vue.use(Radio)
+Vue.use(RadioGroup)
+Vue.use(Switch)
+Vue.use(Checkbox)
+Vue.use(CheckboxGroup)
+Vue.use(Dropdown)
+Vue.use(DropdownMenu)
+Vue.use(DropdownItem)
+Vue.use(DatePicker)
+Vue.use(Upload)
+Vue.use(Tabs)
+Vue.use(TabPane)
+Vue.use(Menu)
+Vue.use(Submenu)
+Vue.use(MenuItem)
+Vue.use(Empty)
+Vue.use(Drawer)
+Vue.use(Timeline)
+Vue.use(TimelineItem)
+Vue.use(Progress)
+Vue.use(Container)
+Vue.use(Header)
+Vue.use(Aside)
+Vue.use(Main)
+Vue.use(Avatar)
+Vue.use(Scrollbar)
+Vue.use(Divider)
+Vue.use(Badge)
+Vue.use(Tree)
+Vue.use(ColorPicker)
+Vue.use(Tooltip)
+Vue.use(Popover)
 
 Vue.prototype.formatPrice = formatPrice
 Vue.prototype.formatPriceWithSymbol = formatPriceWithSymbol