安装Element Plus组件
# 选择一个你喜欢的包管理器
# NPM
$ npm install element-plus --save
# Yarn
$ yarn add element-plus
# pnpm
$ pnpm install element-plus
引入组件
自动导入方式
1. 安装unplugin-vue-components 和 unplugin-auto-import插件
npm install -D unplugin-vue-components unplugin-auto-import
2.修改Vite配置文件
// vite.config.ts
import { defineConfig } from 'vite'
import AutoImport from 'unplugin-auto-import/vite'
import Components from 'unplugin-vue-components/vite'
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
export default defineConfig({
// ...
plugins: [
// ...
AutoImport({
resolvers: [ElementPlusResolver()],
}),
Components({
resolvers: [ElementPlusResolver()],
}),
],
})
在App.vue文件中写入一下代码验证是否能自动引入组件:
<template>
<el-button>我是 ElButton</el-button>
</template>
<script>
</script>
运行成功即可