Skip to content

🔧 unplugin-auto-import-antd is a resolver for unplugin-auto-import that enables on-demand importing of antd components.

License

Notifications You must be signed in to change notification settings

recallwei/unplugin-auto-import-antd

Folders and files

NameName
Last commit message
Last commit date
Nov 15, 2023
Apr 22, 2024
Nov 15, 2023
Apr 22, 2024
Apr 22, 2024
Apr 22, 2024
Apr 22, 2024
Nov 15, 2023
Apr 22, 2024
Apr 22, 2024
Nov 15, 2023
Nov 15, 2023
Apr 22, 2024
Nov 15, 2023
Apr 22, 2024
Apr 22, 2024
Apr 22, 2024
Apr 22, 2024
Apr 22, 2024
Apr 22, 2024
Nov 15, 2023
Apr 22, 2024
Apr 22, 2024
Nov 15, 2023

Repository files navigation

unplugin-auto-import-antd

English / 简体中文

unplugin-auto-import-antd is a resolver for unplugin-auto-import that enables on-demand importing of antd components.

Only support antd v5+.

Features

  • Support Vite, Webpack and more
  • Automatically imports components from antd
  • Support custom prefix for components
  • Support package alias import

Installation

npm

npm i -D unplugin-auto-import-antd unplugin-auto-import

yarn

yarn add -D unplugin-auto-import-antd unplugin-auto-import

pnpm

pnpm add -D unplugin-auto-import-antd unplugin-auto-import

bun

bun add -D unplugin-auto-import-antd unplugin-auto-import

Usage

Vite

// vite.config.ts
import AutoImport from 'unplugin-auto-import/vite'
import AntdResolver from 'unplugin-auto-import-antd'

export default defineConfig({
  plugins: [
    AutoImport({
      resolvers: [AntdResolver()]
    })
  ]
})

Webpack

// webpack.config.js
const AntdResolver = require('unplugin-auto-import-antd')

module.exports = {
  /* ... */
  plugins: [
    require('unplugin-auto-import/webpack')({
      resolvers: [AntdResolver()]
    })
  ]
}

Using custom prefix

// vite.config.ts
import AutoImport from 'unplugin-auto-import/vite'
import AntdResolver from 'unplugin-auto-import-antd'

export default defineConfig({
  plugins: [
    AutoImport({
      resolvers: [
        AntdResolver({
          prefix: 'A'
        })
      ]
    })
  ]
})

If specify a custom prefix,such as A, the way of writing components should changed from original Button to AButton.

Equivalent to import { Button as AButton } from 'antd'.

Using package alias

// vite.config.ts
import AutoImport from 'unplugin-auto-import/vite'
import AntdResolver from 'unplugin-auto-import-antd'

export default defineConfig({
  plugins: [
    AutoImport({
      resolvers: [
        AntdResolver({
          packageName: 'antd-v5'
        })
      ]
    })
  ]
})

Install antd via an alias, such as antd-v5.

Equivalent to import { Button } from 'antd-v5'.

License

MIT License © 2024 Bruce Song

About

🔧 unplugin-auto-import-antd is a resolver for unplugin-auto-import that enables on-demand importing of antd components.

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published