vue3-admin-template
我的项目地址：vue3-admin-template
能拿来间接开发我的项目，不须要思考格式化配置、打包编译优化等等，难道它不香吗？~~
此我的项目是集成 vue3 + vite + Element-Plus + Pinia + vue-router 的后盾管理系统的模板工程。
即开即用，提供初创团队或新我的项目专一于疾速启动和开发交易。不再思考脚手架编译打包和优化、ESLlint 对立配置、我的项目和编码标准等问题。
参考、借鉴 vue-element-admin 我的项目。
在线预览代码
在线预览页面
在关上 vscode 时依据提醒装置上举荐插件。
内容(Content)
蕴含以下内容：
- 权限治理模块
定义后盾人员、角色、角色权限三个模块和 mock 数据。 - vite 脚手架
解决了 vite 脚手架存在的一些问题。vite 的默认打包配置已做优化。 - vue-router
- store 存储 – pinia
-
配置举荐插件
.vscode/extensions.json 中配置了举荐插件，在关上 vscode 时依据提醒装置上举荐插件即可。比方：- vue-volar-extention-pack — vue3 插件全家桶
- eamodio.gitlens — git 记录查看工具
- gruntfuggly.todo-tree – 查看 TODO 事项
- lihuiwang.vue-alias-skip – 别名门路能够点击疾速跳转查看
- 提供插件形式
router、store、plugins、directive 目录可间接创立文件，主动动静引入加载。 - 引入 auto-import 机制
引入 unplugin-auto-import/vite 插件，可主动引入加载组件和 vue、vue-router 的 API - ESLint + Prettier 配置
- 辨别环境变量与配置
辨别 dev 调试环境、dev 的 build 构建环境、test 构建环境、生产构建环境。 - 反对 TypeScript 开发
api 接口的参数 params 倡议都要定义参数对象属性和类型 - libs 工具库
提供了倒计时、数据查看器、加密器、存储器、类型查看器等
组件(Components)
- 具备 SvgIcon 组件
门路：components/SvgIcon/index.vue
能够应用 SvgIcon 展现 svg 格局的 ICON。
应用 svg 做 icon 优于 font icon。 - 列表页面组件
门路：common/ListPage.vue
通过 config.ts 配置疾速创建表格页面的疾速开发，同时也标准对立了表格页面的组件布局和组件款式，可参考views/admin/user/index.vue
若差异化较大列表页面，可参考 ”common/ListPage.vue” 页面复制后重写。 - 信息详情字段单元组件
门路：common/DetailCell.vue
次要为了标准对立订单详情页字段的显示款式。
编写订单详情页可参考views/admin/user/Detail.vue - 新增编辑页组件
门路：components/DynForm/index.jsx
能够实现编辑页面字段的增量更新，防止只批改一个字段更新全副字段的问题。
标准对立订单详情页字段的显示款式。
编写订单详情页可参考 - 有待补充 demo
标准文档
我的项目和编码标准文档是致力于为初创企业、初创团队、新我的项目提供对立的标准，不便我的项目疾速启动，团队合作，保障品质。
倡议约定团队成员装置如下我的项目和编码标准开发。
点击查看 前端我的项目和编码标准
次要分享以下几方面：
- 前端对立标准规范
- 约定我的项目标准，进步代码可读性，不便团队新成员疾速退出我的项目开发。
约定编码格调和标准，躲避一些技术踩坑，晋升代码品质。（蕴含 Vue、React 等编码标准） - git 治理
- 工程配置
- 编程小技巧
- 性能优化
- FAQ 查问
- Vue、Nest、Rect 等我的项目工程模板
会对工程模板有具体的文档阐明，模板可反对我的项目疾速启动。
个性(Features)
- [x] vite 打包编译优化
- [x] 表格的自适应
- [x] 关上页面进度条显示
- [x] 页面全屏
- [x] 全局设置组件大小
- [x] 表格通过 el-height-adaptive-table 指令实现高度自适应
License
MIT
可参考阮一峰老师的开源协定阐明
后续还会持续产出 React 的工程模板、nodejs（Nestjs）工程模板、性能优化专题、前端 FAQ、我的项目和编码标准等，敬请期待 …