# element-plus-study

**Repository Path**: bravo1988/element-plus-study

## Basic Information

- **Project Name**: element-plus-study
- **Description**: element-plus组件库练习（Vue3+TypeScript）
- **Primary Language**: Unknown
- **License**: MIT
- **Default Branch**: main
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-02-24
- **Last Updated**: 2025-02-25

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# element-plus-study

作为一个后端开发，学习前端最大的困难的就是`CSS`和组件库。

网络上的前端入门项目基本都是围绕着组件库的一系列CRUD，没太多技术含量。

所以，建议学完`Vue2`/`Vue3`后，直接打开热门组件库官网，把常用组件写成一个demo：
- 练习`Vue2`/`Vue3`/`TypeScript`语法
- 熟悉组件库用法

## 如何启动当前项目
git 拉取项目到本地，然后执行命令
- `pnpm i`
- `pnpm run dev`

## 如何创建自己的项目
- 构建vue3+ts项目
  - `pnpm create vue@latest`
  - `pnpm init vite@latest`
- 去element-plus官网，根据文档[安装组件库](https://element-plus.org/zh-CN/guide/installation.html)

> `pnpm create vue@latest` 和 `pnpm init vite@latest` 的区别主要是脚手架工具和生成模板的选择，但二者底层最终都是基于 Vite 构建的。`create-vue` 更适合生产级 Vue 项目，而 `create-vite` 适合轻量级场景或自定义组合。

| **对比项**         | `create-vue` (Vue 官方)            | `create-vite` (Vite 官方)         |
|--------------------|------------------------------------|-----------------------------------|
| **模板特性**       | 完整的 Vue 生态推荐配置             | 极简的原生 Vite 模板              |
| **可选项**         | 包含 ESLint、Prettier、测试工具等   | 仅框架和语言（如 TS/JS）选择       |
| **初始依赖**       | 默认包含 Vue 全家桶（Router/Pinia） | 仅基础和框架核心（Vite + Vue）     |
| **配置文件**       | 预置优化后的 Vue + Vite 配置        | 基础的 Vite 配置（需手动扩展）     |