【Vue3】将 Element Plus 引入 Vue3 项目

前言

在 Vue3 项目中使用 Element Plus 可以为项目提供丰富的 UI 组件和交互体验。下面将介绍如何将 Element Plus 引入 Vue3 项目中。

步骤

1. 安装 Element Plus

首先需要通过 npm、yarn 或 pnpm 安装 Element Plus 包。可以选择其中一种方式进行安装。

# NPM
$ npm install element-plus --save

# Yarn
$ yarn add element-plus

# pnpm
$ pnpm install element-plus

2. 修改 main.js

在安装好 Element Plus 后，需要在 main.js 中引入 Element Plus 并注册它，然后挂载 Vue 应用。以下是修改后的 main.js 代码：

import { createApp } from 'vue'
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
import App from './App.vue'

const app = createApp(App)

app.use(ElementPlus)
app.mount('#app')

通过以上步骤，成功地将 Element Plus 引入了 Vue3 项目中，现在就可以开始使用 Element Plus 提供的丰富组件来构建项目界面了。