# vite-plugin-import-component

**Repository Path**: osdpape/vite-plugin-import-component

## Basic Information

- **Project Name**: vite-plugin-import-component
- **Description**: vite 组件按需引入插件
- **Primary Language**: TypeScript
- **License**: MIT
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 1
- **Forks**: 0
- **Created**: 2024-12-04
- **Last Updated**: 2025-03-12

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# @dpapejs/vite-plugin-import-component

Modular import plugin for vite plugin, compatible with [@dpapejs/cmod-ui](http://cmodui.dpapejs.cn/), [Element UI 2.X](https://element.eleme.cn/#/zh-CN), and so on.

## Use

### Install

```sh
npm i @dpapejs/vite-plugin-import-component -D
# OR
yarn add @dpapejs/vite-plugin-import-component -D
```

### `vite.config.js`

```ts
import { defineConfig } from "vite";
import vitePluginImport from '@dpapejs/vite-plugin-import-component'
export default defineConfig({
  plugins: [
    ... // other plugins
     usePluginImport({
      libraryName: '@dpapejs/cmod-ui',
      libraryDirectory: 'es',
      style: true
    })
    // Other configurations welcome PR
  ];
})
```

## API

#### `{ "libraryName": "@dpapejs/cmod-ui" }`

```javascript
<template>
  <div class="example">
    <Button> Button Text </Button>
  </div>
</template>
import { Button } from '@dpapejs/cmod-ui';

      ↓ ↓ ↓ ↓ ↓ ↓

import Button from '@dpapejs/cmod-ui/lib/button/index.js';
import '@dpapejs/cmod-ui/lib/button/style.js'
```

## LICENSE

[MIT](./LICENSE)