2024-07-22 11:11:43 +08:00
|
|
|
|
# 长沪信息[云控系统后台页面]
|
|
|
|
|
|
|
|
|
|
|
|
> 项目基于 vue3x AntDesignVue4x VueRouter4x pinia的后台管理前端框架
|
|
|
|
|
|
|
|
|
|
|
|
[TOC]
|
|
|
|
|
|
|
|
|
|
|
|
## 1. 项目安装
|
|
|
|
|
|
|
|
|
|
|
|
```bash
|
|
|
|
|
|
# 依赖下载
|
|
|
|
|
|
yarn or npm i
|
|
|
|
|
|
# 开发环境运行
|
|
|
|
|
|
yarn dev
|
|
|
|
|
|
# 生产构建
|
|
|
|
|
|
yarn build
|
|
|
|
|
|
# 预览
|
|
|
|
|
|
yarn preview
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
## 2. 代码结构规范
|
|
|
|
|
|
|
|
|
|
|
|
```bash
|
|
|
|
|
|
|--analyze.html 打包依赖分析
|
|
|
|
|
|
|--components.d.ts antdesign组件自动导入
|
|
|
|
|
|
|--package.json 项目依赖管理
|
|
|
|
|
|
|--tsconfig.json ts配置
|
|
|
|
|
|
|--vite.config.ts vite配置
|
|
|
|
|
|
|--src 根目录
|
|
|
|
|
|
|--assets 静态资源文件 不参与打包
|
|
|
|
|
|
|--axios axios封装
|
|
|
|
|
|
|--components 全局公用组件封装
|
|
|
|
|
|
|--codemirror 代码编辑器
|
|
|
|
|
|
|--form antDesign表单二次封装
|
|
|
|
|
|
|--table antDesign表格二次封装
|
|
|
|
|
|
|--configs 全局的一些配置文件
|
|
|
|
|
|
|--directives 自定义指令
|
|
|
|
|
|
|--hooks hooks
|
|
|
|
|
|
|--router router
|
|
|
|
|
|
|--modules--dynamicRouters.ts 动态路由
|
|
|
|
|
|
|--modules--staticRouters.ts 静态路由
|
|
|
|
|
|
|--stores pinia
|
|
|
|
|
|
|--utils utils
|
|
|
|
|
|
|--views 页面存放位置
|
|
|
|
|
|
|--global.d.ts 全局的类型声明
|
|
|
|
|
|
|--.env.development 开发环境参数配置
|
|
|
|
|
|
|--.env.production 生产构建参数配置
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
## 3. 注意
|
|
|
|
|
|
|
|
|
|
|
|
- 项目中所有公共组件使用首字母大写命名
|
|
|
|
|
|
|
|
|
|
|
|
> 例如 FormPro TablePro
|
|
|
|
|
|
|
|
|
|
|
|
- 项目中的页面使用驼峰命名
|
|
|
|
|
|
|
|
|
|
|
|
> 例如 userManage roleManage
|
|
|
|
|
|
|
|
|
|
|
|
- 在使用动态路由的时候，需要严格遵守指定规则，否则不会生效
|
|
|
|
|
|
|
|
|
|
|
|
```tex
|
|
|
|
|
|
项目默认扫描views下的所有.vue的文件
|
|
|
|
|
|
例如：需要配置一个开发管理(dev)=》用户管理(userManage)
|
|
|
|
|
|
开发管理为目录
|
|
|
|
|
|
用户管理为菜单
|
|
|
|
|
|
则path为/dev/userManage 不需要加上views这一层 也不需要以.vue结尾
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
- 项目严重不推荐在开发过程中产生的红色错误或者黄色警告 如有 请自行解决
|
|
|
|
|
|
|
|
|
|
|
|
- 代码规范整洁
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
