安裝element-plus
參考官網
1
2
3
4
5
6
7
8
| NPM
npm install element-plus --save
Yarn
yarn add element-plus
pnpm
pnpm install element-plus
|
完整導入（全局）
在main.ts
1
2
3
4
5
6
7
8
9
10
| import { createApp } from 'vue'
import ElementPlus from 'element-plus'/**/
import 'element-plus/dist/index.css'/**/
import App from './App.vue'
import router from './router'
const app = createApp(App)
app.use(router)/**/
app.use(ElementPlus)/**/
app.mount('#app')
|
自動導入
1
| npm install -D unplugin-vue-components unplugin-auto-import
|
在vite.config.ts,加入以下
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
| /*加入以下*/
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import AutoImport from 'unplugin-auto-import/vite';/*element 自動導入*/
import Components from 'unplugin-vue-components/vite';/*element 自動導入*/
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers';/**/
// https://vitejs.dev/config/
export default defineConfig({
plugins: [
vue(),
/*element 自動導入*/
AutoImport({
resolvers: [ElementPlusResolver()],
}),
/*element 自動導入*/
Components({
resolvers: [ElementPlusResolver()],
}),
],
})
|
github說明
github element-plus安裝與自動導入