当前位置: 首页 > Web前端 > HTML5

Vue3的管理项目项目模板来了~~可以直接快速开发项目,不用考虑各种配置和优化~真香!

时间:2023-04-05 13:14:52 HTML5

vue3-admin-template项目地址:vue3-admin-template可以直接开发项目,不用考虑格式化配置、打包、编译优化等,是不是很好吃?~~本项目是集成vue3+vite+Element-Plus+Pinia+vue-router的后台管理系统模板项目。开箱即用,提供专注于快速启动和开发交易的启动团队或新项目。不再考虑脚手架编译、打包和优化、ESLlint统一配置、项目和编码标准等问题。参考学习vue-element-admin项目。在线预览代码在线预览页面打开vscode后,按照提示安装推荐插件即可。内容(Content)包括以下内容:权限管理模块定义了后台人员、角色、角色权限和模拟数据三个模块。vite脚手架解决了vite脚手架的一些问题。优化了vite的默认打包配置。vue-routerstorestorage-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目录直接创建文件,自动动态导入加载。引入自动导入机制,引入unplugin-auto-import/vite插件,可以自动导入加载组件和APIESLint+vue和vue-router的Prettier配置区分环境变量和配置区分dev调试环境,dev构建构建环境,测试构建环境,生产构建环境。支持TypeScript开发api接口的参数params推荐定义参数对象属性和typelibs工具库,提供倒计时、数据检查器、加密器、存储、类型检查器等组件(Components),SvgIcon组件路径:components/SvgIcon/index.vue可以使用SvgIcon来显示svg格式的ICON。使用svg作为图标优于字体图标。列表页组件路径: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使用说明实现高度适配的LicenseMIT可以参考阮一峰老师的开源协议说明,后续会陆续出React项目模板、nodejs(Nestjs)项目模板、性能优化专题、前端FAQ、项目及编码规范等,敬请期待。..