1.安装babel-plugin-import
npm i babel-plugin-import
2.创建antd配置文件ant-design/index.js,需要用到什么组件把注释去掉就可以了
import Vue from 'vue'
import Antd from 'ant-design-vue'
const {
// Affix,
// BackTop,
ConfigProvider,
// Layout,
Input,
// InputNumber,
Pagination,
Button,
// Switch,
// Radio,
// Checkbox,
Select,
// Card,
Form,
Row,
Col,
// Modal,
Table,
// Tabs,
Icon,
// Badge,
// Popover,
// Dropdown,
// List,
// Avatar,
// Breadcrumb,
Steps,
// Spin,
// Menu,
// Drawer,
Tooltip,
// Alert,
// Tag,
// Tree,
// TreeSelect,
// Divider,
// DatePicker,
// TimePicker,
// Carousel,
// Upload,
// Progress,
// Skeleton,
// Popconfirm,
message
// notification,
// Spin
} = Antd
// Vue.use(Affix)
// Vue.use(BackTop)
Vue.use(ConfigProvider)
Vue.use(Pagination)
// Vue.use(Layout);
Vue.use(Input)
// Vue.use(InputNumber);
Vue.use(Button)
// Vue.use(Switch)
// Vue.use(Radio);
// Vue.use(Checkbox);
Vue.use(Select)
// Vue.use(Card)
Vue.use(Form)
Vue.use(Row)
Vue.use(Col)
// Vue.use(Modal);
Vue.use(Table)
// Vue.use(Tabs);
Vue.use(Icon)
// Vue.use(Badge);
// Vue.use(Popover);
// Vue.use(Dropdown);
// Vue.use(List);
// Vue.use(Avatar);
// Vue.use(Breadcrumb);
Vue.use(Steps)
// Vue.use(Spin);
// Vue.use(Menu);
// Vue.use(Drawer)
Vue.use(Tooltip)
// Vue.use(Alert);
// Vue.use(Tag);
// Vue.use(Tree);
// Vue.use(TreeSelect);
// Vue.use(Divider)
// Vue.use(DatePicker)
// Vue.use(TimePicker);
// Vue.use(Upload);
// Vue.use(Progress);
// Vue.use(Skeleton);
// Vue.use(Popconfirm);
// Vue.use(Carousel);
// Vue.use(Spin)
// Vue.prototype.$confirm = Modal.confirm;
Vue.prototype.$message = message
// Vue.prototype.$notification = notification
// Vue.prototype.$info = Modal.info;
// Vue.prototype.$success = Modal.success;
// Vue.prototype.$error = Modal.error;
// Vue.prototype.$warning = Modal.warning;
Vue.prototype.$form = Form
message.config({
top: `200px`
})
3. 修改main.js 引入配置文件 ant-design/index.js
4.修改配置文件.babelrc
["import",
{
"libraryName": "ant-design-vue",
"libraryDirectory": "es",
"style": "css"
}
],