vite配置ant自动引入

  1. 安装ant组件,并引入使用

//main.ts中
//ant-design-vue
import Antd from 'ant-design-vue';
import 'ant-design-vue/dist/antd.css';
  1. 安装插件

npm install -D unplugin-vue-components unplugin-auto-import
  1. 配置vite.config.ts

import vue from "@vitejs/plugin-vue";
import AutoImport from "unplugin-auto-import/vite";
//自动导入ui-组件 比如ant-design-vue  element-plus
import Components from "unplugin-vue-components/vite";

//ant-design-vue
import { AntDesignVueResolver } from "unplugin-vue-components/resolvers";

//element-plus
import { ElementPlusResolver } from "unplugin-vue-components/resolvers";

export default defineConfig({
  plugins: [
    vue(),
    AutoImport({
      imports: ["vue",'vue-router'],
      dts: "src/auto-import.d.ts",
      resolvers: [AntDesignVueResolver()]
    }),
    Components({
      resolvers: [
        AntDesignVueResolver({ importStyle: true, resolveIcons: true })
      ]
    })
  ]
});
  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值