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,

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 {

src/main.js

@@ -4,17 +4,17 @@ import Vue from 'vue'
 import App from './App'
 import router from './router/lazy'
 import 'ant-design-vue/dist/antd.css'
+import Antd from 'ant-design-vue'
 import Viser from 'viser-vue'
 import axios from 'axios'
-import message from 'ant-design-vue/es/message'
 import '@/mock'
 import store from './store'
 import PouchDB from 'pouchdb'
 
 Vue.prototype.$axios = axios
-Vue.prototype.$message = message
 Vue.config.productionTip = false
 Vue.use(Viser)
+Vue.use(Antd)
 
 /* eslint-disable no-new */
 new Vue({

src/pages/dashboard/Analysis.vue

@@ -102,17 +102,10 @@
 </template>
 
 <script>
-import ACol from 'ant-design-vue/es/grid/Col'
-import ARow from 'ant-design-vue/es/grid/Row'
-import ACard from 'ant-design-vue/es/card/Card'
 import ChartCard from '../../components/card/ChartCard'
-import ATooltip from 'ant-design-vue/es/tooltip/Tooltip'
-import AIcon from 'ant-design-vue/es/icon/icon'
 import MiniArea from '../../components/chart/MiniArea'
 import MiniBar from '../../components/chart/MiniBar'
 import MiniProgress from '../../components/chart/MiniProgress'
-import ATabs from 'ant-design-vue/es/tabs'
-import ADatePicker from 'ant-design-vue/es/date-picker'
 import Bar from '../../components/chart/Bar'
 import RankingList from '../../components/chart/RankingList'
 import HotSearch from '../../components/analysis/HotSearch'
@@ -128,8 +121,6 @@ for (let i = 0; i < 8; i++) {
   })
 }
 
-const ATabPane = ATabs.TabPane
-const ARangePicker = ADatePicker.RangePicker
 export default {
   name: 'analysis',
   data () {
@@ -137,24 +128,7 @@ export default {
       rankList
     }
   },
-  components: {
-    Trend,
-    SalesData,
-    HotSearch,
-    RankingList,
-    Bar,
-    ARangePicker,
-    ATabPane,
-    ATabs,
-    MiniProgress,
-    MiniBar,
-    MiniArea,
-    AIcon,
-    ATooltip,
-    ChartCard,
-    ACard,
-    ARow,
-    ACol}
+  components: {Trend, SalesData, HotSearch, RankingList, Bar, MiniProgress, MiniBar, MiniArea, ChartCard}
 }
 </script>
 

src/pages/dashboard/WorkPlace.vue

@@ -89,39 +89,12 @@
 <script>
 import PageHeader from '../../components/page/PageHeader'
 import PageLayout from '../../layouts/PageLayout'
-import AAvatar from 'ant-design-vue/es/avatar/Avatar'
 import HeadInfo from '../../components/tool/HeadInfo'
-import ARow from 'ant-design-vue/es/grid/Row'
-import ACol from 'ant-design-vue/es/grid/Col'
-import ACard from 'ant-design-vue/es/card/Card'
-import ACardGrid from 'ant-design-vue/es/card/Grid'
-import ACardMeta from 'ant-design-vue/es/card/Meta'
-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 AIcon from 'ant-design-vue/es/icon/icon'
 import Radar from '../../components/chart/Radar'
 
-const AListItemMeta = AListItem.Meta
-
 export default {
   name: 'WorkPlace',
-  components: {
-    Radar,
-    AIcon,
-    AButton,
-    AListItemMeta,
-    AListItem,
-    AList,
-    ACardMeta,
-    ACardGrid,
-    ACard,
-    ACol,
-    ARow,
-    HeadInfo,
-    AAvatar,
-    PageLayout,
-    PageHeader},
+  components: {Radar, HeadInfo, PageLayout, PageHeader},
   data () {
     return {
       projects: [],

src/pages/detail/AdvancedDetail.vue

@@ -122,21 +122,11 @@
 
 <script>
 import PageLayout from '../../layouts/PageLayout'
-import AButtonGroup from 'ant-design-vue/es/button/button-group'
-import AButton from 'ant-design-vue/es/button/button'
-import AIcon from 'ant-design-vue/es/icon/icon'
 import DetailList from '../../components/tool/DetailList'
-import ARow from 'ant-design-vue/es/grid/Row'
-import ACol from 'ant-design-vue/es/grid/Col'
-import ACard from 'ant-design-vue/es/card/Card'
-import ASteps from 'ant-design-vue/es/steps/index'
 import AStepItem from '../../components/tool/AStepItem'
-import ADivider from 'ant-design-vue/es/divider/index'
-import ATable from 'ant-design-vue/es/table'
 import {operation1, operation2, operation3, operationColumns} from '../../mock/common/tableData'
 
 const DetailListItem = DetailList.Item
-const AStep = ASteps.Step
 const AStepItemGroup = AStepItem.Group
 
 const tabList = [
@@ -171,22 +161,7 @@ export default {
       console.log(key)
     }
   },
-  components: {
-    ATable,
-    ADivider,
-    AStepItemGroup,
-    AStepItem,
-    AStep,
-    ASteps,
-    ACard,
-    ACol,
-    ARow,
-    DetailListItem,
-    DetailList,
-    AIcon,
-    AButton,
-    AButtonGroup,
-    PageLayout}
+  components: {AStepItemGroup, AStepItem, DetailListItem, DetailList, PageLayout}
 }
 </script>
 

src/pages/detail/BasicDetail.vue

@@ -36,12 +36,7 @@
 </template>
 
 <script>
-import ACard from 'ant-design-vue/es/card/Card'
-import ATooltip from 'ant-design-vue/es/tooltip/Tooltip'
-import AAvatar from 'ant-design-vue/es/avatar/Avatar'
 import DetailList from '../../components/tool/DetailList'
-import ADivider from 'ant-design-vue/es/divider/index'
-import ATable from 'ant-design-vue/es/table'
 import PageLayout from '../../layouts/PageLayout'
 
 const DetailListItem = DetailList.Item
@@ -190,7 +185,7 @@ const scheduleData = [
 
 export default {
   name: 'BasicDetail',
-  components: {PageLayout, ATable, ADivider, DetailListItem, DetailList, AAvatar, ATooltip, ACard},
+  components: {PageLayout, DetailListItem, DetailList},
   data () {
     return {
       goodsColumns,

src/pages/form/BasicForm.vue

@@ -83,35 +83,8 @@
 </template>
 
 <script>
-import ACard from 'ant-design-vue/es/card/Card'
-import AForm from 'ant-design-vue/es/form/Form'
-import AFormItem from 'ant-design-vue/es/form/FormItem'
-import AInput from 'ant-design-vue/es/input/Input'
-import ADatePicker from 'ant-design-vue/es/date-picker'
-import ATextarea from 'ant-design-vue/es/input/TextArea'
-import AInputNumber from 'ant-design-vue/es/input-number/index'
-import ARadioGroup from 'ant-design-vue/es/radio/Group'
-import ARadio from 'ant-design-vue/es/radio/Radio'
-import ASelect from 'ant-design-vue/es/select/index'
-import AButton from 'ant-design-vue/es/button/button'
-
-const ARangePicker = ADatePicker.RangePicker
-const ASelectOption = ASelect.Option
 export default {
   name: 'BasicForm',
-  components: {
-    AButton,
-    ASelectOption,
-    ASelect,
-    ARadio,
-    ARadioGroup,
-    AInputNumber,
-    ATextarea,
-    ARangePicker,
-    AInput,
-    AFormItem,
-    AForm,
-    ACard},
   data () {
     return {
       desc: '表单页用于向用户收集或验证信息，基础表单常见于数据项较少的表单场景。',

src/pages/form/advancedForm/AdvancedForm.vue

@@ -16,16 +16,14 @@
 </template>
 
 <script>
-import ACard from 'ant-design-vue/es/card/Card'
 import RepositoryForm from './RepositoryForm'
 import TaskForm from './TaskForm'
 import TableForm from './TableForm'
 import FooterToolBar from '../../../components/tool/FooterToolBar'
-import AButton from 'ant-design-vue/es/button/button'
 
 export default {
   name: 'AdvancedForm',
-  components: {AButton, FooterToolBar, TableForm, TaskForm, RepositoryForm, ACard},
+  components: {FooterToolBar, TableForm, TaskForm, RepositoryForm},
   data () {
     return {
       desc: '高级表单常见于一次性输入和提交大批量数据的场景。',

src/pages/form/advancedForm/RepositoryForm.vue

@@ -75,22 +75,9 @@
 </template>
 
 <script>
-import AForm from 'ant-design-vue/es/form/Form'
-import AFormItem from 'ant-design-vue/es/form/FormItem'
-import ACol from 'ant-design-vue/es/grid/Col'
-import ARow from 'ant-design-vue/es/grid/Row'
-import AInput from 'ant-design-vue/es/input/Input'
-import ASelect from 'ant-design-vue/es/select/index'
-import ADatePicker from 'ant-design-vue/es/date-picker'
-import AButton from 'ant-design-vue/es/button/button'
-
-const ASelectOption = ASelect.Option
-const ARangePicker = ADatePicker.RangePicker
-
 export default {
   name: 'RepositoryForm',
   props: ['showSubmit'],
-  components: {AButton, ARangePicker, ASelectOption, ASelect, AInput, ARow, ACol, AFormItem, AForm},
   methods: {
     handleSubmit (e) {
       e.preventDefault()

src/pages/form/advancedForm/TableForm.vue

@@ -45,13 +45,6 @@
 </template>
 
 <script>
-import ATable from 'ant-design-vue/es/table'
-import AButton from 'ant-design-vue/es/button/button'
-import AInput from 'ant-design-vue/es/input/Input'
-import ADivider from 'ant-design-vue/es/divider/index'
-import APopconfirm from 'ant-design-vue/es/popconfirm/index'
-import AFormItem from 'ant-design-vue/es/form/FormItem'
-
 const columns = [
   {
     title: '成员姓名',
@@ -107,7 +100,6 @@ const dataSource = [
 
 export default {
   name: 'TableForm',
-  components: {AFormItem, APopconfirm, ADivider, AInput, AButton, ATable},
   data () {
     return {
       columns,

src/pages/form/advancedForm/TaskForm.vue

@@ -74,21 +74,9 @@
 </template>
 
 <script>
-import AForm from 'ant-design-vue/es/form/Form'
-import AFormItem from 'ant-design-vue/es/form/FormItem'
-import ACol from 'ant-design-vue/es/grid/Col'
-import ARow from 'ant-design-vue/es/grid/Row'
-import AInput from 'ant-design-vue/es/input/Input'
-import ASelect from 'ant-design-vue/es/select/index'
-import AButton from 'ant-design-vue/es/button/button'
-import ATimePicker from 'ant-design-vue/es/time-picker/index'
-
-const ASelectOption = ASelect.Option
-
 export default {
   name: 'TaskForm',
   props: ['showSubmit'],
-  components: {ATimePicker, AButton, ASelectOption, ASelect, AInput, ARow, ACol, AFormItem, AForm},
   methods: {
     handleSubmit (e) {
       e.preventDefault()

src/pages/form/stepForm/Step1.vue

@@ -45,18 +45,8 @@
 </template>
 
 <script>
-import AForm from 'ant-design-vue/es/form/Form'
-import AFormItem from 'ant-design-vue/es/form/FormItem'
-import AButton from 'ant-design-vue/es/button/button'
-import ASelect from 'ant-design-vue/es/select/index'
-import AInputGroup from 'ant-design-vue/es/input/Group'
-import AInput from 'ant-design-vue/es/input/Input'
-
-const ASelectOption = ASelect.Option
-
 export default {
   name: 'Step1',
-  components: {AInput, AInputGroup, ASelectOption, ASelect, AButton, AFormItem, AForm},
   methods: {
     nextStep () {
       this.$emit('nextStep')

src/pages/form/stepForm/Step2.vue

@@ -47,13 +47,8 @@
 </template>
 
 <script>
-import AForm from 'ant-design-vue/es/form/Form'
-import AFormItem from 'ant-design-vue/es/form/FormItem'
-import AButton from 'ant-design-vue/es/button/button'
-import AAlert from 'ant-design-vue/es/alert/index'
 export default {
   name: 'Step2',
-  components: {AAlert, AButton, AFormItem, AForm},
   data () {
     return {
       loading: false

src/pages/form/stepForm/Step3.vue

@@ -11,13 +11,10 @@
 </template>
 
 <script>
-import AForm from 'ant-design-vue/es/form/Form'
-import AFormItem from 'ant-design-vue/es/form/FormItem'
-import AButton from 'ant-design-vue/es/button/button'
 import Result from '../../../components/result/Result'
 export default {
   name: 'Step3',
-  components: {Result, AButton, AFormItem, AForm},
+  components: {Result},
   methods: {
     doOnceAgin () {
       this.$emit('finish')

src/pages/form/stepForm/StepForm.vue

@@ -14,17 +14,13 @@
 </template>
 
 <script>
-import ACard from 'ant-design-vue/es/card/Card'
-import ASteps from 'ant-design-vue/es/steps/index'
 import Step1 from './Step1'
 import Step2 from './Step2'
 import Step3 from './Step3'
 
-const AStep = ASteps.Step
-
 export default {
   name: 'StepForm',
-  components: {Step1, Step2, Step3, AStep, ASteps, ACard},
+  components: {Step1, Step2, Step3},
   data () {
     return {
       desc: '将一个冗长或用户不熟悉的表单任务分成多个步骤，指导用户完成。',

src/pages/list/CardList.vue

@@ -27,14 +27,6 @@
 </template>
 
 <script>
-import AList from 'ant-design-vue/es/list/index'
-import AListItem from 'ant-design-vue/es/list/Item'
-import ACard from 'ant-design-vue/es/card/Card'
-import ACardMeta from 'ant-design-vue/es/card/Meta'
-import AAvatar from 'ant-design-vue/es/avatar/Avatar'
-import AButton from 'ant-design-vue/es/button/button'
-import AIcon from 'ant-design-vue/es/icon/icon'
-
 const dataSource = []
 dataSource.push(null)
 for (let i = 0; i < 11; i++) {
@@ -47,7 +39,6 @@ for (let i = 0; i < 11; i++) {
 
 export default {
   name: 'CardList',
-  components: {AIcon, AButton, AAvatar, ACardMeta, ACard, AListItem, AList},
   data () {
     return {
       desc: '段落示意：蚂蚁金服务设计平台 ant.design，用最小的工作量，无缝接入蚂蚁金服生态， 提供跨越设计与开发的体验解决方案。',

src/pages/list/QueryList.vue

@@ -103,24 +103,7 @@
 </template>
 
 <script>
-import ARow from 'ant-design-vue/es/grid/Row'
-import ACol from 'ant-design-vue/es/grid/Col'
-import AForm from 'ant-design-vue/es/form/Form'
-import AFormItem from 'ant-design-vue/es/form/FormItem'
-import AInput from 'ant-design-vue/es/input/Input'
-import ACard from 'ant-design-vue/es/card/Card'
-import ASelect from 'ant-design-vue/es/select/index'
-import AInputNumber from 'ant-design-vue/es/input-number/index'
-import ADatePicker from 'ant-design-vue/es/date-picker/index'
-import AButton from 'ant-design-vue/es/button/button'
-import AIcon from 'ant-design-vue/es/icon/icon'
 import StandardTable from '../../components/table/StandardTable'
-import ADropdown from 'ant-design-vue/es/dropdown'
-import AMenu from 'ant-design-vue/es/menu/index'
-
-const ASelectOption = ASelect.Option
-const AMenuItem = AMenu.Item
-
 const columns = [
   {
     title: '规则编号',
@@ -164,23 +147,7 @@ for (let i = 0; i < 100; i++) {
 
 export default {
   name: 'QueryList',
-  components: {
-    AMenuItem,
-    AMenu,
-    ADropdown,
-    StandardTable,
-    AIcon,
-    AButton,
-    ADatePicker,
-    AInputNumber,
-    ASelectOption,
-    ASelect,
-    ACard,
-    AInput,
-    AFormItem,
-    AForm,
-    ACol,
-    ARow},
+  components: {StandardTable},
   data () {
     return {
       advanced: true,

src/pages/list/StandardList.vue

@@ -67,50 +67,10 @@
 </template>
 
 <script>
-import ACard from 'ant-design-vue/es/card/Card'
-import ARow from 'ant-design-vue/es/grid/Row'
-import ACol from 'ant-design-vue/es/grid/Col'
 import HeadInfo from '../../components/tool/HeadInfo'
-import AButton from 'ant-design-vue/es/button/button'
-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 AProgress from 'ant-design-vue/es/progress'
-import ADropdown from 'ant-design-vue/es/dropdown'
-import AMenu from 'ant-design-vue/es/menu/index'
-import AIcon from 'ant-design-vue/es/icon/icon'
-import AButtonGroup from 'ant-design-vue/es/button/button-group'
-import AInput from 'ant-design-vue/es/input/Input'
-import AInputSearch from 'ant-design-vue/es/input/Search'
-import ARadioGroup from 'ant-design-vue/es/radio/Group'
-import ARadio from 'ant-design-vue/es/radio'
-
-const AListItemMeta = AListItem.Meta
-const AMenuItem = AMenu.Item
-const ARadioButton = ARadio.Button
 export default {
   name: 'StandardList',
-  components: {
-    ARadioButton,
-    ARadio,
-    ARadioGroup,
-    AInputSearch,
-    AInput,
-    AButtonGroup,
-    AIcon,
-    AMenuItem,
-    AMenu,
-    ADropdown,
-    AProgress,
-    AAvatar,
-    AListItemMeta,
-    AListItem,
-    AList,
-    AButton,
-    HeadInfo,
-    ACol,
-    ARow,
-    ACard}
+  components: {HeadInfo}
 }
 </script>
 

src/pages/list/search/ApplicationList.vue

@@ -43,22 +43,10 @@
 </template>
 
 <script>
-import ACard from 'ant-design-vue/es/card/Card'
 import SearchForm from './SearchForm'
-import AList from 'ant-design-vue/es/list'
-import AListItem from 'ant-design-vue/es/list/Item'
-import ACardMeta from 'ant-design-vue/es/card/Meta'
-import AAvatar from 'ant-design-vue/es/avatar/Avatar'
-import ATooltip from 'ant-design-vue/es/tooltip/Tooltip'
-import AIcon from 'ant-design-vue/es/icon/icon'
-import ADropdown from 'ant-design-vue/es/dropdown'
-import AMenu from 'ant-design-vue/es/menu/index'
-
-const AMenuItem = AMenu.Item
-
 export default {
   name: 'ApplicationList',
-  components: {AMenuItem, AMenu, ADropdown, AIcon, ATooltip, AAvatar, ACardMeta, AListItem, AList, SearchForm, ACard}
+  components: {SearchForm}
 }
 </script>
 

src/pages/list/search/ArticleList.vue

@@ -33,18 +33,10 @@
 </template>
 
 <script>
-import ACard from 'ant-design-vue/es/card/Card'
 import SearchForm from './SearchForm'
-import AList from 'ant-design-vue/es/list'
-import AListItem from 'ant-design-vue/es/list/Item'
-import ATag from 'ant-design-vue/es/tag/Tag'
-import AAvatar from 'ant-design-vue/es/avatar/Avatar'
-import AIcon from 'ant-design-vue/es/icon/icon'
-
-const AListItemMeta = AListItem.Meta
 export default {
   name: 'ArticleList',
-  components: {AIcon, ATag, AAvatar, AListItem, AListItemMeta, AList, SearchForm, ACard}
+  components: {SearchForm}
 }
 </script>
 

src/pages/list/search/ProjectList.vue

@@ -27,20 +27,14 @@
 </template>
 
 <script>
-import ACard from 'ant-design-vue/es/card/Card'
 import SearchForm from './SearchForm'
-import AList from 'ant-design-vue/es/list'
-import AListItem from 'ant-design-vue/es/list/Item'
-import ACardMeta from 'ant-design-vue/es/card/Meta'
-import AAvatar from 'ant-design-vue/es/avatar/Avatar'
 import AvatarList from '../../../components/tool/AvatarList'
-import ATooltip from 'ant-design-vue/es/tooltip/Tooltip'
 
 const AvatarListItem = AvatarList.Item
 
 export default {
   name: 'ProjectList',
-  components: {ATooltip, AvatarListItem, AvatarList, AAvatar, ACardMeta, AListItem, AList, SearchForm, ACard}
+  components: {AvatarListItem, AvatarList, SearchForm}
 }
 </script>
 

src/pages/list/search/SearchForm.vue

@@ -68,22 +68,14 @@
 </template>
 
 <script>
-import ACard from 'ant-design-vue/es/card/Card'
-import AForm from 'ant-design-vue/es/form/Form'
-import AFormItem from 'ant-design-vue/es/form/FormItem'
-import AInput from 'ant-design-vue/es/input/Input'
 import TagSelect from '../../../components/tool/TagSelect'
 import FormRow from '../../../components/form/FormRow'
-import ASelect from 'ant-design-vue/es/select/index'
-import ARow from 'ant-design-vue/es/grid/Row'
-import ACol from 'ant-design-vue/es/grid/Col'
 
 const TagSelectOption = TagSelect.Option
-const ASelectOption = ASelect.Option
 
 export default {
   name: 'SearchForm',
-  components: {ACol, ARow, ASelectOption, ASelect, FormRow, TagSelectOption, TagSelect, AInput, AFormItem, AForm, ACard},
+  components: {FormRow, TagSelectOption, TagSelect},
   methods: {
     lookMyself () {
       this.form.setFieldsValue({

src/pages/list/search/SearchLayout.vue

@@ -19,17 +19,8 @@
 </template>
 
 <script>
-import AInput from 'ant-design-vue/es/input/Input'
-import AInputGroup from 'ant-design-vue/es/input/Group'
-import AButton from 'ant-design-vue/es/button/button'
-import AInputSearch from 'ant-design-vue/es/input/Search'
-import ATabs from 'ant-design-vue/es/tabs'
-
-const ATabPane = ATabs.TabPane
-
 export default {
   name: 'SearchLayout',
-  components: {ATabPane, ATabs, AInputSearch, AButton, AInputGroup, AInput},
   computed: {
     activeKey () {
       switch (this.$route.path) {

src/pages/login/Login.vue

@@ -72,37 +72,11 @@
 </template>
 
 <script>
-import AForm from 'ant-design-vue/es/form/Form'
-import ATabs from 'ant-design-vue/es/tabs'
 import GlobalFooter from '../../layouts/GlobalFooter'
-import AFormItem from 'ant-design-vue/es/form/FormItem'
-import AInput from 'ant-design-vue/es/input/Input'
-import AIcon from 'ant-design-vue/es/icon/icon'
-import AInputGroup from 'ant-design-vue/es/input/Group'
-import AButton from 'ant-design-vue/es/button/button'
-import ACol from 'ant-design-vue/es/grid/Col'
-import ARow from 'ant-design-vue/es/grid/Row'
-import ACheckbox from 'ant-design-vue/es/checkbox/Checkbox'
-import AAlert from 'ant-design-vue/es/alert/index'
-
-const ATabPane = ATabs.TabPane
 
 export default {
   name: 'Login',
-  components: {
-    AAlert,
-    ACheckbox,
-    ACol,
-    ARow,
-    AButton,
-    AInputGroup,
-    AIcon,
-    AInput,
-    AFormItem,
-    GlobalFooter,
-    ATabPane,
-    ATabs,
-    AForm},
+  components: {GlobalFooter},
   data () {
     return {
       logging: false,

src/pages/result/Error.vue

@@ -25,12 +25,9 @@
 
 <script>
 import Result from '../../components/result/Result'
-import ACard from 'ant-design-vue/es/card/Card'
-import AIcon from 'ant-design-vue/es/icon/icon'
-import AButton from 'ant-design-vue/es/button/button'
 export default {
   name: 'Error',
-  components: {AButton, AIcon, ACard, Result},
+  components: {Result},
   data () {
     return {
       title: '提交失败',

src/pages/result/Success.vue

@@ -36,33 +36,14 @@
 
 <script>
 import Result from '../../components/result/Result'
-import ACard from 'ant-design-vue/es/card/Card'
-import AButton from 'ant-design-vue/es/button/button'
-import ACol from 'ant-design-vue/es/grid/Col'
-import ARow from 'ant-design-vue/es/grid/Row'
-import ASteps from 'ant-design-vue/es/steps/index'
-import AIcon from 'ant-design-vue/es/icon/icon'
 import DetailList from '../../components/tool/DetailList'
 import AStepItem from '../../components/tool/AStepItem'
 
-const AStep = ASteps.Step
 const AStepItemGroup = AStepItem.Group
 const DetailListItem = DetailList.Item
 export default {
   name: 'Success',
-  components: {
-    AStepItemGroup,
-    AStepItem,
-    DetailListItem,
-    DetailList,
-    AIcon,
-    AStep,
-    ASteps,
-    ARow,
-    ACol,
-    AButton,
-    ACard,
-    Result},
+  components: {AStepItemGroup, AStepItem, DetailListItem, DetailList, Result},
   data () {
     return {
       title: '提交成功',