refactor: register ant-design-vue components in main.js #28

src/components/analysis/HotSearch.vue

@@ -34,11 +34,7 @@
 </template>
 
 <script>
-import ARow from 'ant-design-vue/es/grid/Row'
-import ACol from 'ant-design-vue/es/grid/Col'
-import AIcon from 'ant-design-vue/es/icon/icon'
 import MiniArea from '../chart/MiniArea'
-import ATable from 'ant-design-vue/es/table'
 
 const searchData = []
 for (let i = 0; i < 50; i++) {
@@ -79,7 +75,7 @@ const columns = [
 
 export default {
   name: 'HotSearch',
-  components: {ATable, MiniArea, AIcon, ARow, ACol},
+  components: {MiniArea},
   data () {
     return {
       searchData,

src/components/analysis/SalesData.vue

@@ -16,12 +16,8 @@
 </template>
 
 <script>
-import ARadio from 'ant-design-vue/es/radio'
 const DataSet = require('@antv/data-set')
 
-const ARadioGroup = ARadio.Group
-const ARadioButton = ARadio.Button
-
 const sourceData = [
   { item: '事例一', count: 40 },
   { item: '事例二', count: 21 },
@@ -46,7 +42,6 @@ dv.transform({
 const data = dv.rows
 export default {
   name: 'SalesData',
-  components: {ARadioGroup, ARadioButton},
   data () {
     return {
       data,

src/components/card/ChartCard.vue

@@ -21,10 +21,8 @@
 </template>
 
 <script>
-import ACard from 'ant-design-vue/es/card/Card'
 export default {
   name: 'ChartCard',
-  components: {ACard},
   props: ['title', 'total']
 }
 </script>

src/components/chart/MiniProgress.vue

@@ -13,10 +13,8 @@
 </template>
 
 <script>
-import ATooltip from 'ant-design-vue/es/tooltip/Tooltip'
 export default {
   name: 'MiniProgress',
-  components: {ATooltip},
   props: ['target', 'color', 'percent', 'height']
 }
 </script>

src/components/chart/Trend.vue

@@ -7,10 +7,8 @@
 </template>
 
 <script>
-import AIcon from 'ant-design-vue/es/icon/icon'
 export default {
   name: 'Trend',
-  components: {AIcon},
   props: {
     term: {
       type: String,

src/components/checkbox/ColorCheckbox.vue

@@ -5,8 +5,6 @@
 </template>
 
 <script>
-import AIcon from 'ant-design-vue/es/icon/icon'
-
 const Group = {
   name: 'ColorCheckboxGroup',
   props: {
@@ -82,7 +80,6 @@ const Group = {
 export default {
   name: 'ColorCheckbox',
   Group: Group,
-  components: {AIcon},
   props: {
     color: {
       type: String,

src/components/checkbox/ImgCheckbox.vue

@@ -8,8 +8,6 @@
 </template>
 
 <script>
-import AIcon from 'ant-design-vue/es/icon/icon'
-
 const Group = {
   name: 'ImgCheckboxGroup',
   props: {
@@ -94,7 +92,6 @@ export default {
       sChecked: this.checked
     }
   },
-  components: {AIcon},
   inject: ['groupContext'],
   watch: {
     'sChecked': function (val) {

src/components/exception/ExceptionPage.vue

@@ -15,13 +15,11 @@
 </template>
 
 <script>
-import AButton from 'ant-design-vue/es/button/button'
 import Config from './typeConfig'
 
 export default {
   name: 'ExceptionPage',
   props: ['type'],
-  components: {AButton},
   data () {
     return {
       config: Config

src/components/menu/Contextmenu.vue

@@ -7,12 +7,8 @@
 </template>
 
 <script>
-import AMenu from 'ant-design-vue/es/menu/index'
-import AIcon from 'ant-design-vue/es/icon/icon'
-const AMenuItem = AMenu.Item
 export default {
   name: 'Contextmenu',
-  components: {AIcon, AMenuItem, AMenu},
   props: {
     visible: {
       type: Boolean,

src/components/menu/SiderMenu.vue

@@ -11,11 +11,10 @@
 </template>
 
 <script>
-import ALayoutSider from 'ant-design-vue/es/layout/Sider'
 import IMenu from './menu'
 export default {
   name: 'SiderMenu',
-  components: {IMenu, ALayoutSider},
+  components: {IMenu},
   props: {
     collapsible: {
       type: Boolean,

src/components/page/PageHeader.vue

@@ -28,13 +28,8 @@
 </template>
 
 <script>
-import ABreadcrumb from 'ant-design-vue/es/breadcrumb'
-import AAvatar from 'ant-design-vue/es/avatar/Avatar'
-
-const ABreadcrumbItem = ABreadcrumb.Item
 export default {
   name: 'PageHeader',
-  components: {AAvatar, ABreadcrumbItem, ABreadcrumb},
   props: {
     title: {
       type: String,

src/components/result/Result.vue

@@ -15,10 +15,8 @@
 </template>
 
 <script>
-import AIcon from 'ant-design-vue/es/icon/icon'
 export default {
   name: 'Result',
-  components: {AIcon},
   props: ['isSuccess', 'title', 'description']
 }
 </script>

src/components/setting/Setting.vue

@@ -67,42 +67,18 @@
 </template>
 
 <script>
-import ALayoutSider from 'ant-design-vue/es/layout/Sider'
-import AIcon from 'ant-design-vue/es/icon/icon'
 import SettingItem from './SettingItem'
 import StyleItem from './StyleItem'
-import ADivider from 'ant-design-vue/es/divider/index'
-import AList from 'ant-design-vue/es/list/index'
-import AListItem from 'ant-design-vue/es/list/Item'
-import AButton from 'ant-design-vue/es/button/button'
-import ASwitch from 'ant-design-vue/es/switch/index'
-import ASelect from 'ant-design-vue/es/select/index'
 import ColorCheckbox from '../checkbox/ColorCheckbox'
 import ImgCheckbox from '../checkbox/ImgCheckbox'
 import Clipboard from 'clipboard'
 
-const ASelectOption = ASelect.Option
 const ColorCheckboxGroup = ColorCheckbox.Group
 const ImgCheckboxGroup = ImgCheckbox.Group
 
 export default {
   name: 'Setting',
-  components: {
-    ImgCheckboxGroup,
-    ImgCheckbox,
-    ColorCheckboxGroup,
-    ColorCheckbox,
-    ASelectOption,
-    ASelect,
-    ASwitch,
-    AButton,
-    AListItem,
-    AList,
-    ADivider,
-    StyleItem,
-    SettingItem,
-    AIcon,
-    ALayoutSider},
+  components: {ImgCheckboxGroup, ImgCheckbox, ColorCheckboxGroup, ColorCheckbox, StyleItem, SettingItem},
   computed: {
     multipage () {
       return this.$store.state.setting.multipage

src/components/setting/StyleItem.vue

@@ -8,11 +8,9 @@
 </template>
 
 <script>
-import AIcon from 'ant-design-vue/es/icon/icon'
 export default {
   name: 'StyleItem',
-  props: ['selected', 'img'],
-  components: {AIcon}
+  props: ['selected', 'img']
 }
 </script>
 

src/components/table/StandardTable.vue

@@ -28,12 +28,8 @@
 </template>
 
 <script>
-import AAlert from 'ant-design-vue/es/alert/index'
-import ATable from 'ant-design-vue/es/table'
-
 export default {
   name: 'StandardTable',
-  components: {ATable, AAlert},
   props: ['bordered', 'loading', 'columns', 'dataSource', 'rowKey', 'pagination', 'selectedRows'],
   data () {
     return {

src/components/task/TaskGroup.vue

@@ -16,7 +16,6 @@
 </template>
 
 <script>
-import AIcon from 'ant-design-vue/es/icon/icon'
 import Draggable from 'vuedraggable'
 
 const dragOptions = {
@@ -31,7 +30,7 @@ const dragOptions = {
 
 export default {
   name: 'TaskGroup',
-  components: {AIcon, Draggable},
+  components: {Draggable},
   props: ['title', 'group'],
   data () {
     return {

src/components/task/TaskItem.vue

@@ -5,11 +5,9 @@
 </template>
 
 <script>
-import ACard from 'ant-design-vue/es/card/Card'
 export default {
   name: 'TaskItem',
-  props: ['content'],
-  components: {ACard}
+  props: ['content']
 }
 </script>
 

src/components/tool/AStepItem.vue

@@ -10,8 +10,6 @@
 </template>
 
 <script>
-import AIcon from 'ant-design-vue/es/icon/icon'
-
 const Group = {
   name: 'AStepItemGroup',
   render (h) {
@@ -26,7 +24,6 @@ const Group = {
 export default {
   name: 'AStepItem',
   Group: Group,
-  components: {AIcon},
   props: ['title', 'icon', 'link', 'titleStyle', 'iconStyle'],
   methods: {
     go () {

src/components/tool/AvatarList.vue

@@ -43,7 +43,6 @@ const Item = {
 }
 export default {
   name: 'AvatarList',
-  components: {ATooltip},
   Item: Item
 }
 </script>

src/components/tool/DetailList.vue

@@ -9,7 +9,6 @@
 
 <script>
 import ACol from 'ant-design-vue/es/grid/Col'
-import ARow from 'ant-design-vue/es/grid/Row'
 const Item = {
   name: 'DetailListItem',
   props: {
@@ -91,7 +90,6 @@ export default {
       default: 'horizontal'
     }
   },
-  components: {ARow, ACol},
   provide () {
     return {
       col: this.col > 4 ? 4 : this.col

src/components/tool/Drawer.vue

@@ -16,10 +16,8 @@
 </template>
 
 <script>
-import AIcon from 'ant-design-vue/es/icon/icon'
 export default {
   name: 'Drawer',
-  components: {AIcon},
   data () {
     return {
       drawerWidth: 0

src/components/tool/TagSelect.vue

@@ -7,14 +7,11 @@
 </template>
 
 <script>
-import ASelect from 'ant-design-vue/es/select/index'
-import ACheckableTag from 'ant-design-vue/es/tag/CheckableTag'
 import TagSelectOption from './TagSelectOption'
-import AIcon from 'ant-design-vue/es/icon/icon'
 export default {
   name: 'TagSelect',
   Option: TagSelectOption,
-  components: {AIcon, TagSelectOption, ACheckableTag, ASelect},
+  components: {TagSelectOption},
   data () {
     return {
       showTrigger: false,

src/components/tool/TagSelectOption.vue

@@ -5,10 +5,8 @@
 </template>
 
 <script>
-import ACheckableTag from 'ant-design-vue/es/tag/CheckableTag'
 export default {
   name: 'TagSelectOption',
-  components: {ACheckableTag},
   props: {
     size: {
       type: String,