94 lines
2.3 KiB
Markdown
94 lines
2.3 KiB
Markdown
---
|
|
name: vite-plugin-uni-components
|
|
description: On-demand automatic component imports for uni-app - derived from unplugin-vue-components
|
|
---
|
|
|
|
# vite-plugin-uni-components
|
|
|
|
Automatic on-demand component imports for uni-app. Derived from unplugin-vue-components with uni-app specific adaptations.
|
|
|
|
## Installation
|
|
|
|
```bash
|
|
npm i -D @uni-helper/vite-plugin-uni-components
|
|
```
|
|
|
|
## Setup
|
|
|
|
```ts
|
|
// vite.config.ts
|
|
import Uni from '@dcloudio/vite-plugin-uni'
|
|
import Components from '@uni-helper/vite-plugin-uni-components'
|
|
import { defineConfig } from 'vite'
|
|
|
|
export default defineConfig({
|
|
plugins: [
|
|
Components(), // Must be before Uni()
|
|
Uni(),
|
|
],
|
|
})
|
|
```
|
|
|
|
## Features
|
|
|
|
- Automatic component imports from `src/components`
|
|
- Supports UI library resolvers
|
|
- Generates TypeScript declarations
|
|
- Handles `default` export for third-party UI libraries
|
|
|
|
## Supported UI Libraries
|
|
|
|
Built-in resolvers for:
|
|
|
|
| Library | Import |
|
|
|---------|--------|
|
|
| Ano UI | `AnoUIResolver()` |
|
|
| uni-ui | `UniUIResolver()` |
|
|
| wot-design-uni | `WotDesignUniResolver()` |
|
|
| uv-uni | `UvUniResolver()` |
|
|
| uview-pro | `UviewProResolver()` |
|
|
| z-paging | `ZPagingResolver()` |
|
|
|
|
## TypeScript Declarations
|
|
|
|
For pnpm users, create `.npmrc`:
|
|
|
|
```ini
|
|
shamefully-hoist = true
|
|
```
|
|
|
|
Generated `components.d.ts` example:
|
|
|
|
```ts
|
|
declare module 'vue' {
|
|
export interface GlobalComponents {
|
|
AButton: typeof import('ano-ui/components/AButton/AButton.vue')['default']
|
|
UniCalendar: typeof import('@dcloudio/uni-ui/lib/uni-calendar/uni-calendar.vue')['default']
|
|
MyComponent: typeof import('./src/components/MyComponent.vue')['default']
|
|
}
|
|
}
|
|
```
|
|
|
|
## Third-Party Component Handling
|
|
|
|
For third-party components like `@dcloudio/uni-ui` and `ano-ui`, the plugin automatically adds the `default` property to handle H5 compatibility issues:
|
|
|
|
```diff
|
|
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']
|
|
}
|
|
}
|
|
```
|
|
|
|
## Full Configuration
|
|
|
|
See [unplugin-vue-components documentation](https://github.com/antfu/unplugin-vue-components) for all options.
|
|
|
|
<!--
|
|
Source references:
|
|
- https://github.com/uni-helper/vite-plugin-uni-components
|
|
- https://uni-helper.js.org/vite-plugin-uni-components
|
|
-->
|