从unplugin-vue-components派生并修改以适应UniApp。
pnpm i -D @uni-helper/vite-plugin-uni-components
// vite.config.ts
import { defineConfig } from 'vite'
import Uni from '@dcloudio/vite-plugin-uni'
import Components from '@uni-helper/vite-plugin-uni-components'
export default defineConfig({
plugins: [
// make sure put it before `Uni()`
Components(),
Uni(),
],
})
支持的 UI 库:
如果你使用 pnpm
,请在根目录下创建一个 .npmrc
文件,参见issue。
// .npmrc
public-hoist-pattern[]=@vue*
// or
// shamefully-hoist = true
更多信息请查看unplugin-vue-components
Tip
对于第三方组件(如 dcloudio/uni-ui,ano-ui) 使用 vite-plugin-uni-components
会生成 default
属性,解决在 H5 端无法正确处理组件的问题。
declare module 'vue' {
export interface GlobalComponents {
- AButton: typeof import('ano-ui/components/AButton/AButton.vue')['AButton']
+ AButton: typeof import('ano-ui/components/AButton/AButton.vue')['default']
Book: typeof import('./src/components/book/index.vue')['default']
ComponentA: typeof import('./src/components/ComponentA.vue')['default']
- UniCalendar: typeof import('@dcloudio/uni-ui/lib/uni-calendar/uni-calendar.vue')['UniCalendar']
+ UniCalendar: typeof import('@dcloudio/uni-ui/lib/uni-calendar/uni-calendar.vue')['default']
}
}