按需导入antd/ant-design-vue,Nuxt按需导入antd/ant-design-vue
1、首先我在创建项目的时候就选择了antd这个框架,所以插件那块会有一个antd-ui.js如果没有的话,可以npm安装以下antd,然后按照上面的目录建立一个jsnpm i ant-design-vue1、按需导入import Vue from 'vue'import { Carousel } from 'ant-design-vue/lib';import 'ant-des...
·
1、所有文章优先发表在个人博客上: https://www.xdx97.com
2、后续如果有修改的话,可能忘记更新到CSDN了,给你带来不便,抱歉。
3、个人博客本篇文章地址 : https://www.xdx97.com/article/647074798064631808
1、首先我在创建项目的时候就选择了antd这个框架,所以插件那块会有一个antd-ui.js
如果没有的话,可以npm安装一下antd,然后在plugins目录下建立一个antd-ui.js
npm i ant-design-vue
配置按需导入
1、配置JS
import Vue from 'vue'
import Carousel from 'ant-design-vue/lib/carousel'; // 加载 JS
import Spin from 'ant-design-vue/lib/spin'; // 加载 JS
import Tag from 'ant-design-vue/lib/tag'; // 加载 JS
import Icon from 'ant-design-vue/lib/icon'; // 加载 JS
import Input from 'ant-design-vue/lib/input'; // 加载 JS
import Button from 'ant-design-vue/lib/button'; // 加载 JS
import Pagination from 'ant-design-vue/lib/pagination'; // 加载 JS
import Modal from 'ant-design-vue/lib/modal'; // 加载 JS
import Tooltip from 'ant-design-vue/lib/tooltip'; // 加载 JS
import Steps from 'ant-design-vue/lib/steps'; // 加载 JS
import Collapse from 'ant-design-vue/lib/collapse'; // 加载 JS
import Divider from 'ant-design-vue/lib/divider'; // 加载 JS
import message from 'ant-design-vue/lib/message'; // 加载 JS
Vue.use(Carousel)
Vue.use(Spin)
Vue.use(Tag)
Vue.use(Icon)
Vue.use(Input)
Vue.use(Button)
Vue.use(Pagination)
Vue.use(Modal)
Vue.use(Tooltip)
Vue.use(Steps)
Vue.use(Collapse)
Vue.use(Divider)
Vue.prototype.$message = message;
message.config({
top: `70px`,
duration: 2,
maxCount: 3,
});
2、配置css
最终效果
更多推荐
已为社区贡献34条内容
所有评论(0)