import{_ as s,c as a,o as i,aj as e}from"./chunks/framework.DNhrqZu5.js";const g=JSON.parse('{"title":"多 UI 组件库供选择","description":"","frontmatter":{},"headers":[],"relativePath":"guide/vue3/ui.md","filePath":"guide/vue3/ui.md","lastUpdated":1756280955000}'),t={name:"guide/vue3/ui.md"},n=e(`

多 UI 组件库供选择

Vite 构建工具,使用 vite-plugin-style-importunplugin-vue-components/vite 实现按需引入。

安装插件

bash
pnpm add unplugin-vue-components/vite -D

使用组件库

vant 、 varlet 和 nutUI 可以使用组件按需加载

config/vite/plugins/component.ts

javascript
import { VantResolver, VarletUIResolver } from 'unplugin-vue-components/resolvers';
import NutUIResolver from '@nutui/auto-import-resolver';
...
resolvers: [VantResolver(), VarletUIResolver(), NutUIResolver()],
...

不需要某个组件库

只需删除对应的 resolvers 即可

删除后需全局搜索删除不需要的组件,避免报错

参考文档

`,13),l=[n];function p(h,r,o,k,d,c){return i(),a("div",null,l)}const v=s(t,[["render",p]]);export{g as __pageData,v as default};