如何在Nuxt里按需引入ant-design

最新推荐文章于 2023-04-17 01:52:59 发布
最新推荐文章于 2023-04-17 01:52:59 发布
阅读量3k 收藏 4
点赞数 1
分类专栏： VUE 文章标签： javascript vue.js 前端 html
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_45788388/article/details/106101467
版权

我项目在安装脚手架的时候，UI框架选的是element，现在项目里要加入骨架屏，element没有，所以，引入了ant的骨架屏。

element和ant都是插拔式的，可以按需引入。下面写一下安装ant的过程。

1、安装antd。

npm install ant-design-vue --save

2、安装 babel-plugin-import来进行按需加载。

npm install babel-plugin-import --save-dev

3、根目录下新建.babelrc文件。配置如下：

"plugins":
最低0.47元/天 解锁文章
代码哒搬运工
关注
  • 1
    点赞
  • 踩
  • 4
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
专栏目录
Nuxt3 安装配置Ant design Vue框架
qq_35032712的博客
03-27 846
然后，在浏览器中访问 http://localhost:3000/，您应该可以看到Nuxt3应用程序的默认欢迎页面。使用的 Vite，你可以使用 unplugin-vue-components 来进行按需加载。在nuxt.config.ts中引入。
create-nuxt-antd:使用ant-design的nuxt项目
05-15
适婚 使用ant-design的nuxt项目 构建设置 # install dependencies $ yarn install # serve with hot reload at localhost:3000 $ yarn run dev # build for production and launch server $ yarn run build $ yarn start # generate static project $ yarn run generate 有关工作原理的详细说明，请 。
Nuxt3 + Ant-Design-Vue 初体验
system_xyz的博客
07-05 3765
nuxt3+antd vue
Nuxt项目引入antd vue组件全过程
m0_55790549的博客
09-27 1354
Nuxt项目使用antd的注意事项
Nuxt.js & Ant Design Vue 配置按需加载引入组件踩坑记录
任磊
11-03 4037
Nuxt.js & Ant Design Vue 踩坑记录 最近开发一个带SEO以及部分后台功能的项目，Nuxt.js作为vue ssr框架可以非常好的完成这个需求，这里我选择了Ant Design Vue作为UI组件库。 以下是踩坑的一些记录 ： 首先介绍一下项目情况和需求： Nuxt.js是一个 Vue.js 通用框架，预设了使用 Vue.js 开发服务端渲染的各种配置。项目中使用的是Universal (SSR) 模式，因此首屏是由服务端完成渲染。 项目仅用到少数的UI组件，因此我们
Nuxt3 引入插件的 (ant-design-vue ui) 的 最新方式
qq_33950912的博客
04-17 1359
nuxt3 引入插件 （ant-design-vue ui） 的 最新方式
nuxt-ant-design-vue
05-08
@ nuxtjs-extra / ant-design-vue 适用于Ant Design Vue的Nuxt模块设置向项目添加依赖项yarn add @nuxtjs-extra/ant-design-vue @nuxt/components # or npm install @nuxtjs-extra/ant-design-vue 如果您使用...
nuxt-ant-design-vue:Nuxt +模块化蚂蚁设计Vue组件
03-29
具有来自Ant Design Vue的基本布局（仪表板） 构建设置 # install dependencies $ yarn install # serve with hot reload at localhost:3000 $ yarn dev # build for production and launch server $ yarn build $ ...
用于设置ant-design-vue中table组件的列宽可拖拽
最新发布
08-05
vuex2.x中用于设置ant-design-vue中table组件的列宽可拖拽
Nuxt配置Element-UI按需引入的操作方法
10-15
主要介绍了Nuxt配置Element-UI按需引入方法，本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
Nuxt 3.0.0正式发布，集成Element Plus、Ant Design Vue和Arco Design Vue脚手架
bufegar0的博客
11-27 1800
Nuxt 3 目前支持 Node.js 14、16、18 和 19，建议使用最新的 Node.js LTS 版本，由于 Node.js 14 即将 EOL，开发者最好尽可能升级到最新的 18.x。Nuxt 3.0 11天前正式发布了稳定版，3.0 基于 Vue 3，为 TypeScript 提供了 “一等公民” 支持，并进行了一次彻底的重构，对内核进行了精简，速度更快，体验更好。Nuxt 是使用简便的 Web 框架，用于构建现代和高性能的 Web 应用，可以部署在任何运行 JavaScript 的平台上。
nuxt 2 + vue2学习
fth1002853070的博客
11-18 1061
Nuxt.js 2.0 + vue 2.0 学习 + 服务器部署
前端框架 Nuxt3 Vue3 SSR 总结
qq_50909707的博客
12-12 3967
前端框架 Nuxt3 Vue3 SSR 总结
Vue3中 引入Ant Design(推荐阅读)
hsany330的专栏
11-30 8429
Ant Design 是一个很好用的前端组件库，里面包含有很多基础组件，能极大提高我们的开发效率 下面先贴出 官方文档，里面的介绍已经十分全面和详细，大家遇到的很多问题都可以在上面找到答案 假设现在我们已经用 vue-cli 3 工具创建了一个 Vue 项目，然后怎么在项目中引入 Ant Design 呢？ 首先介绍一下 vue-cli 3 默认生成的目录结构，关于 vue-cli 3 的具体使用可以参考我的 另一篇文章 + demo + node_modules（存放第三方模块）
Nuxt3+Ant-design-vue国际化,自定义主题
yongjian_123的博客
03-23 3303
Nuxt3+Ant-design-vue国际化,自定义主题
nuxt3 Vue3全局引入ant-design-vue3的图标库
谷小伟的博客
02-17 1159
Nuxt3 Vue3 全局引入ant-design-vue3的图标库
nuxt.js-ant-design-vue配置踩坑日记
Jack, what else can you do besides holding your little darling?
08-03 1420
nuxt.js-ant-design-vue配置踩坑日记
Nuxt项目中使用TDesign(vue2)
YanHSama的博客
06-29 263
Nuxt项目中使用TDesign
nuxt3 ant design 按需引入
05-27
要在 Nuxt 3 中按需引入 Ant Design，你可以使用 babel-plugin-import 插件。首先，你需要安装该插件： ```bash npm install babel-plugin-import -D ``` 然后，在你的 Nuxt 3 项目的根目录下创建一个名为 babel....

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值