# 01cd_vue_element

**Repository Path**: cn_01cd_vue/01cd_vue_element

## Basic Information

- **Project Name**: 01cd_vue_element
- **Description**: No description available
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-11-12
- **Last Updated**: 2025-12-01

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# Vue 3 + Element Plus 项目

这是一个基于 Vue 3、Element Plus、Vue Router 和 Pinia 构建的现代化前端项目。

## 技术栈

- **Vue 3.4** - 渐进式 JavaScript 框架
- **Element Plus** - 基于 Vue 3 的组件库
- **Vue Router 4** - 官方路由管理器
- **Pinia** - Vue 的状态管理库
- **Vite** - 下一代前端构建工具

## 项目结构

```
├── public/          # 静态资源
├── src/
│   ├── assets/      # 资源文件
│   ├── components/  # 公共组件
│   ├── router/      # 路由配置
│   ├── store/       # Pinia 状态管理
│   ├── views/       # 页面组件
│   ├── App.vue      # 根组件
│   └── main.js      # 入口文件
├── index.html       # HTML 模板
├── vite.config.js   # Vite 配置
└── package.json     # 项目配置
```

## 开始使用

### 安装依赖

```bash
npm install
```

### 开发运行

```bash
npm run dev
```

项目将在 `http://localhost:3000` 启动

### 构建生产版本

```bash
npm run build
```

### 预览生产构建

```bash
npm run preview
```

## 功能特性

- ✅ Vue 3 Composition API
- ✅ Element Plus UI 组件
- ✅ Vue Router 路由管理
- ✅ Pinia 状态管理
- ✅ Vite 快速构建
- ✅ 路径别名配置 (@ 指向 src)

## 开发指南

### 添加新页面

1. 在 `src/views/` 目录下创建新的 Vue 组件
2. 在 `src/router/index.js` 中添加路由配置

### 使用状态管理

在组件中使用 Pinia store：

```javascript
import { useMainStore } from '@/store/index'

const mainStore = useMainStore()
```

### 使用 Element Plus 组件

所有 Element Plus 组件和图标已全局注册，可直接使用。

## 许可证

MIT