vite-plugin-element-plus

This repo is for element-plus related Vite plugin

Showing:

Popularity

Downloads/wk

1.1K

GitHub Stars

14

Maintenance

Last Commit

12d ago

Contributors

3

Package

Dependencies

2

License

Type Definitions

Built-In

Tree-Shakeable

Yes?

Categories

Readme

Archived

If you are looking for plugins please go to https://github.com/element-plus/unplugin-element-plus

vite-plugin-element-plus

English | 中文

This repo is for element-plus related Vite plugin

Install

npm i vite-plugin-element-plus -D

Usage

vite.config.js:

import importElementPlus from 'vite-plugin-element-plus'

export default {
  plugins: [
    importElementPlus(),
  ],
}

// or
export default {
  plugins: [
    importElementPlus({
      useSource: true
    }),
  ],
}

app code:

import { ElButton } from 'element-plus'

      ↓ ↓ ↓ ↓ ↓ ↓

import { ElButton } from 'element-plus'
import 'element-plus/es/components/button/style/css'

Options

useSource

type UseSource = boolean

default: false

// useSource: false
import { ElButton } from 'element-plus'

      ↓ ↓ ↓ ↓ ↓ ↓

import { ElButton } from 'element-plus'
import 'element-plus/es/components/button/style/css'

// useSource: true
import { ElButton } from 'element-plus'

      ↓ ↓ ↓ ↓ ↓ ↓

import { ElButton } from 'element-plus'
import 'element-plus/es/components/button/style/index'

lib

Normally you wouldn't use this option but as a general option we exposed it anyway. When using this your bundle structure should be the same as ElementPlus. See unpkg.com for more information

type Lib = string

default: 'element-plus'

// lib: 'other-lib'
import { ElButton } from 'other-lib'

      ↓ ↓ ↓ ↓ ↓ ↓

import { ElButton } from 'other-lib'
import 'other-lib/es/components/button/style/css'

format

type Format = 'esm' | 'cjs'

default: 'esm'

esm for [lib]/es/components/* cjs for [lib]/lib/components/*

  • /es for ES Module 输出
  • /lib for commonJS 的输出

This option is for which format to use

// format: 'cjs'
import { ElButton } from 'element-plus'

      ↓ ↓ ↓ ↓ ↓ ↓

import { ElButton } from 'element-plus'
import 'element-plus/lib/components/button/style/css'

prefix

type Prefix = string
// prefix = Al
import { AlButton } from 'xx-lib'

Rate & Review

Great Documentation0
Easy to Use0
Performant0
Highly Customizable0
Bleeding Edge0
Responsive Maintainers0
Poor Documentation0
Hard to Use0
Slow0
Buggy0
Abandoned0
Unwelcoming Community0
100
No reviews found
Be the first to rate

Alternatives

No alternatives found

Tutorials

No tutorials found
Add a tutorial