# vite-plugin-uni-components

**Repository Path**: collectors/vite-plugin-uni-components

## Basic Information

- **Project Name**: vite-plugin-uni-components
- **Description**: No description available
- **Primary Language**: Unknown
- **License**: MIT
- **Default Branch**: main
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2024-07-02
- **Last Updated**: 2024-07-02

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

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

从[unplugin-vue-components](https://github.com/antfu/unplugin-vue-components)派生并修改以适应UniApp。

[![NPM version](https://img.shields.io/npm/v/@uni-helper/vite-plugin-uni-components?color=a1b858&label=)](https://www.npmjs.com/package/@uni-helper/vite-plugin-uni-components)

对于第三方组件([dcloudio/uni-ui](https://github.com/dcloudio/uni-ui)，[ano-ui](https://github.com/ano-ui/ano-ui)) 使用 `vite-plugin-uni-components` 会生成 `default` 属性，解决在 H5 端无法正确处理组件的问题。

```diff
declare module '@vue/runtime-core' {
  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']
  }
}
```

## 安装

```bash
pnpm i -D @uni-helper/vite-plugin-uni-components
```

## 使用

```ts
// vite.config.ts
import { defineConfig } from 'vite'
import Uni from '@dcloudio/vite-plugin-uni'
import Components from '@uni-helper/vite-plugin-uni-components'

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    // make sure put it before `Uni()`
    Components(),
    Uni(),
  ],
})
```

## 从 UI 库导入

支持的 UI 库：

- [Ano UI](./packages/core/src/_resolvers/ano-ui.ts)
- [uni-ui](./packages/core/src/_resolvers/uni-ui.ts)
- [wot-design-uni](./packages/core/src/_resolvers/wot-design-uni.ts)

## UI 组件类型提示

如果你使用 `pnpm` ，请在根目录下创建一个 `.npmrc` 文件，参见[issue](https://github.com/antfu/unplugin-vue-components/issues/389)。

```
// .npmrc
public-hoist-pattern[]=@vue*
// or
// shamefully-hoist = true
```

see more in [unplugin-vue-components](https://github.com/antfu/unplugin-vue-components#installation)

## License

[MIT](./LICENSE) License © 2023-PRESENT [Neil Lee](https://github.com/zguolee)