Vue3 Vite模板
项目说明
介绍
项目基于Vite,vue3.3.x,arco-vue2.x,axios, pinia, vue-router, eslint + prettier
- Vue (>=3.3)
- 构建工具：Vite (>=4.x)
- router：vue-router (>= 4.x)
- store：pinia
- http： axios
- UI轮子： arco-vue （>=2.x）
- 代码检测与格式化：eslint + prettier
gitHub 地址
项目地址 - master 分支
预安装
环境要求
使用Node.js大于18.20.0版本，corepack管理包管理工具。（corepack暂为实现性功能，安装nodejs后执行：corepack enable）
Node.js: - 版本最好大于等于18.20.0pnpm: - 包管理工具, 版本大于等于9.0.0
UI 框架
使用
使用 Vite 5.x 版本搭建, pnpm 9.x 包管理器
开发环境
pnpm dev
打包
pnpm build # 正式环境打包
pnpm build:test # 测试环境打包
格式化
pnpm lint # prettier风格格式化代码
目录说明
.
├── .env #通用配置
├── .env.development #开发环境配置
├── .env.production #正式环境配置
├── .env.testing #测试环境配置
├── postcss.config.js #postcss
├── index.html #html模板
├── public
│ └── favicon.ico
├── src
│ ├── assets #静态资源
│ │ ├── style #less（主题、less变量、全局css）
│ │ └── images #图片资源
│ ├── api #接口目录
│ │ └── demo.js #接口文件
│ ├── components #全局组件
│ ├── config #公共config,挂载Vue原型链this.$config
│ ├── enums #枚举
│ │ ├── appEnum.js #app
│ │ └── httpEnum.js #网络请求枚举
│ ├── layouts #布局目录
│ ├── router #路由管理
│ │ ├── modules #路由存放目录
│ │ ├── routerGuards.js #路由hooks
│ │ ├── routes.js #子路由集合
│ │ ├── scrollBehavior.js #路由scrollBehavior
│ │ └── index.js
│ ├── setup #公共方法注册挂载目录
│ │ ├── app.js #app
│ │ ├── directives.js
│ │ ├── components.js #注册全局组件
│ │ └── methods.js
│ ├── store #vuex
│ │ ├── module #store模块
│ │ └── index.js
│ ├── utils #工具集
│ │ ├── directives #自定义指令
│ │ ├── files #文件处理
│ │ ├── http #axios
│ │ ├── browser.js #浏览器处理
│ │ ├── color.js #颜色
│ │ ├── dateUtil.js #日期
│ │ ├── mitt.js #eventBus
│ │ ├── is.js #判断
│ │ ├── storage.js #本地存储、cookie
│ │ └── tools.js #其他类方法
│ └── views #Page Views
└── vite.config.js #项目配置
Git 提交规范
基于 husky lint-staged eslint + prettier commitlint
需严格按照commit规范提交
