# vue-next

**Repository Path**: tuvdance/vue-next

## Basic Information

- **Project Name**: vue-next
- **Description**: 开源的https://gitee.com/tuvdance/
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2022-03-28
- **Last Updated**: 2024-10-05

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

<!--
 * @Author: master
 * @Date: 2022-04-11 09:39:13
 * @LastEditTime: 2022-04-12 14:28:17
 * @Description: 框架简介
-->
# 框架介绍

### 名称

前端 web 端框架（[代码规范](./explain/前端规范/README.md)）

开发项目的目录说明（[项目规范](./main/project/README.md)）

---

### 简介

框架包括工程构建与业务构建

* 工程构建：node、vite、eslint、stylelint、prettier、pnpm等
  - node 14版本以上
  - vite 构建工具
  - eslint 语法规范
  - stylelint 样式语法规范
  - prettier 代码格式化工具
  - pnpm 包管理工具
  
* 业务构建：vue、vue-i18n、vue-router、mitt、pinia、axios、arco-design等
  - vue ^3.2.31
  - vue-i18n ^9.2.0-beta.33
  - vue-router ^4.0.14
  - mitt ^3.0.0
  - pinia ^2.0.13
  - axios ^0.26.1
  - arco-design ^2.22.0
  - vant ^3.4.7
  
---

## 使用
### 相关命令

1. 安装依赖:
   pnpm install
2. 运行:
   pnpm run dev
3. 编译:
   pnpm run build

编译后文件存在 dist 目录下
### vscode配置
   * 请拷贝vscode.config.json内容到自己的开发工具内
   * 请安装相关辅助插件 Volar 等
---

## 框架说明

### 命令（inquirer）式的选择项目启动
启动入口：./vite/dev.js(build.js)
### 每个项目的执行入口

1. html 入口
   /main/project/**/index.html
2. js 入口
   /main/project/**/index.js
### 升级内容

1. 包管理：npm升级为**pnpm**
2. 构建工具：webpack升级为**vite**
3. 开发框架：vue2升级为**vue3**
4. UI框架pc端：antd升级为**arco**
5. UI框架mobile端：vant升级为**vant3.0**
6. 状态管理：vuex升级为**pinia**
7. 事件监听：eventBus升级为**mitt**
8. 项目名称：可以随意定义项目名称，不再特定 **.pro** 为结尾
9. 项目静态目录：之前的静态目录（static），现以 **public** 目录归类
---

## 总体架构图

![Image text](./explain/架构.png)