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

src/layouts/GlobalFooter.vue

@@ -12,11 +12,9 @@
 </template>
 
 <script>
-import AIcon from 'ant-design-vue/es/icon/icon'
 export default {
   name: 'GlobalFooter',
-  props: ['copyright', 'linkList'],
-  components: {AIcon}
+  props: ['copyright', 'linkList']
 }
 </script>
 

src/layouts/GlobalHeader.vue

@@ -25,32 +25,14 @@
 </template>
 
 <script>
-import ALayout from 'ant-design-vue/es/layout'
-import AIcon from 'ant-design-vue/es/icon/icon'
-import AInputSearch from 'ant-design-vue/es/input/Search'
 import HeaderSearch from './HeaderSearch'
 import HeaderNotice from './HeaderNotice'
-import ATooltip from 'ant-design-vue/es/tooltip/Tooltip'
 import HeaderAvatar from './HeaderlAvatar'
-import ADivider from 'ant-design-vue/es/divider/index'
 import IMenu from '../components/menu/menu'
 
-const ALayoutSider = ALayout.Sider
-const ALayoutHeader = ALayout.Header
 export default {
   name: 'GlobalHeader',
-  components: {
-    IMenu,
-    ADivider,
-    HeaderAvatar,
-    ATooltip,
-    HeaderNotice,
-    HeaderSearch,
-    AInputSearch,
-    AIcon,
-    ALayout,
-    ALayoutSider,
-    ALayoutHeader},
+  components: {IMenu, HeaderAvatar, HeaderNotice, HeaderSearch},
   props: ['collapsed', 'menuData'],
   computed: {
     isMobile () {

src/layouts/GlobalLayout.vue

@@ -23,36 +23,19 @@
 </template>
 
 <script>
-import ALayout from 'ant-design-vue/es/layout'
 import GlobalHeader from './GlobalHeader'
-import AIcon from 'ant-design-vue/es/icon/icon'
 import GlobalFooter from './GlobalFooter'
 import Drawer from '../components/tool/Drawer'
 import SiderMenu from '../components/menu/SiderMenu'
 import Setting from '../components/setting/Setting'
 
-const ALayoutSider = ALayout.Sider
-const ALayoutHeader = ALayout.Header
-const ALayoutContent = ALayout.Content
-const ALayoutFooter = ALayout.Footer
 const minHeight = window.innerHeight - 64 - 24 - 122
 
 let menuData = []
 
 export default {
   name: 'GlobalLayout',
-  components: {
-    Setting,
-    SiderMenu,
-    Drawer,
-    GlobalFooter,
-    AIcon,
-    GlobalHeader,
-    ALayout,
-    ALayoutSider,
-    ALayoutHeader,
-    ALayoutContent,
-    ALayoutFooter},
+  components: {Setting, SiderMenu, Drawer, GlobalFooter, GlobalHeader},
   data () {
     return {
       minHeight: minHeight + 'px',

src/layouts/HeaderNotice.vue

@@ -40,21 +40,8 @@
 </template>
 
 <script>
-import APopover from 'ant-design-vue/es/popover/index'
-import AIcon from 'ant-design-vue/es/icon/icon'
-import ABadge from 'ant-design-vue/es/badge/Badge'
-import ATabs from 'ant-design-vue/es/tabs'
-import AList from 'ant-design-vue/es/list/index'
-import AListItem from 'ant-design-vue/es/list/Item'
-import AAvatar from 'ant-design-vue/es/avatar/Avatar'
-import ASpin from 'ant-design-vue/es/spin/Spin'
-
-const ATabPane = ATabs.TabPane
-const AListItemMeta = AListItem.Meta
-
 export default {
   name: 'HeaderNotice',
-  components: {ASpin, AAvatar, AListItem, AList, ATabs, ABadge, AIcon, APopover, ATabPane, AListItemMeta},
   data () {
     return {
       loadding: false

src/layouts/HeaderSearch.vue

@@ -13,12 +13,8 @@
 </template>
 
 <script>
-import AIcon from 'ant-design-vue/es/icon/icon'
-import AAutoComplete from 'ant-design-vue/es/auto-complete/index'
-import AInput from 'ant-design-vue/es/input/Input'
 export default {
   name: 'HeaderSearch',
-  components: {AInput, AAutoComplete, AIcon},
   data () {
     return {
       dataSource: ['选项一', '选项二'],

src/layouts/HeaderlAvatar.vue

@@ -25,17 +25,8 @@
 </template>
 
 <script>
-import ADropdown from 'ant-design-vue/es/dropdown'
-import AAvatar from 'ant-design-vue/es/avatar/Avatar'
-import AIcon from 'ant-design-vue/es/icon/icon'
-import AMenu from 'ant-design-vue/es/menu/index'
-
-const AMenuItem = AMenu.Item
-const AMenuDivider = AMenu.Divider
-
 export default {
   name: 'HeaderAvatar',
-  components: {AMenu, AMenuItem, AMenuDivider, AIcon, AAvatar, ADropdown},
   computed: {
     currUser () {
       return this.$store.state.account.user

src/layouts/MenuView.vue

@@ -25,15 +25,10 @@
 
 <script>
 import GlobalLayout from './GlobalLayout'
-import ATabs from 'ant-design-vue/es/tabs'
-import AMenu from 'ant-design-vue/es/menu/index'
-import AIcon from 'ant-design-vue/es/icon/icon'
 import Contextmenu from '../components/menu/Contextmenu'
-const ATabPane = ATabs.TabPane
-const AMenuItem = AMenu.Item
 export default {
   name: 'MenuView',
-  components: {Contextmenu, AIcon, AMenuItem, AMenu, ATabPane, ATabs, GlobalLayout},
+  components: {Contextmenu, GlobalLayout},
   data () {
     return {
       pageList: [],

src/layouts/PageLayout.vue

@@ -21,10 +21,9 @@
 
 <script>
 import PageHeader from '../components/page/PageHeader'
-import AIcon from 'ant-design-vue/es/icon/icon'
 export default {
   name: 'PageLayout',
-  components: {AIcon, PageHeader},
+  components: {PageHeader},
   props: ['desc', 'logo', 'title', 'avatar', 'linkList', 'extraImage'],
   data () {
     return {