uni-helper/vite-plugin-uni-components

适用于 uni-app 的按需自动引入组件

@uni-helper/vite-plugin-uni-components

从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 库导入

支持的 UI 库：

• Ano UI
• uni-ui
• wot-design-uni
• uv-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']
 }
}

License

MIT License © 2023-PRESENT Neil Lee