创建一个element plus项目

当然可以！下面是一个 Vue 3 + Element Plus 的最简单完整示例，它包括：

• 使用 <el-button> 按钮组件
• 点击按钮后用 ElMessage 弹出提示

---

✅ 1. 安装并初始化项目（如果还没创建项目）

你可以用官方推荐的方式快速创建 Vue 3 项目：

npm init vue@latest

然后根据提示选择：

• ✅ Framework: Vue
• ✅ Variant: JavaScript 或 TypeScript
• ✅ Router / Pinia / ESLint（可选）

进入项目并安装依赖：

cd your-project-name
npm install

---

✅ 2. 安装 Element Plus

npm install element-plus

---

✅ 3. 在入口文件中引入 Element Plus

编辑 src/main.js（或 main.ts）：

import { createApp } from 'vue'
import App from './App.vue'// 引入 Element Plus
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'const app = createApp(App)
app.use(ElementPlus)
app.mount('#app')

---

✅ 4. 编辑 src/App.vue

这是一个最简单的页面，只包含一个按钮和点击提示：

<template><div style="padding: 30px"><el-button type="primary" @click="sayHello">点击我</el-button></div>
</template><script setup>
import { ElMessage } from 'element-plus'const sayHello = () => {ElMessage.success('你好，Element Plus！')
}
</script>

---

✅ 5. 运行项目

npm run dev

浏览器中会打开页面，点击按钮会弹出提示框：

✅ 你好，Element Plus！

---

🚀 总结

项目	技术
框架	Vue 3
UI 库	Element Plus（Element UI 的 Vue 3 版本）
功能	显示按钮 + 点击弹窗

---