前端开发规范
- 代码质量开发规范
- 代码风格格式化规范
- git工作流程提交规范
- 项目组织规范
- 项目模板规范
- 通用脚手架开发
- 技术文档保留规范
- 异常处理规范
- 前后端协作规范
- 双周分享 技术分享落地留存规范
- 新人培训规范 新人入职流程规范
前期准备
- 开发工具
vscode
vscode所需插件
:Vetur
、ESLint
、Prettir-Code formatter
、Prettier ESLint
代码质量规范
Eslint
- 项目目录配置
.eslintrc.js
文件用于项目规范、规范可以一起定义或者使用行业标准规范 -
Eslint
安装使用说明,前期手动安装,后期集成到脚手架工具安装。 - 规范待定制,提供初版,后期综合讨论定制完整版
lint规范
- 项目目录配置
代码风格规范
prettier
- 项目目录配置
.prettier.json
文件、格式化规范需要共同讨论 - 提供一版初版的规范用于初始化前期使用
- 结合
Eslint
定制完整格式化规范
- 项目目录配置
vscode编辑器配置
- 项目创建
.vscode文件
并创建.settings.json
文件用于编辑器配置 - 配置自动格式化,代码保存即自动格式化文件,保障代码风格统一
- 项目创建
git工作流程规范
- 版本控制规范 xx
- 分支命名规范
- 分支命名规范定义 按迭代 按用户 按版本
- 大版本小版本的命名规范
- 提交信息规范
-
commitlint
使用,统一格式化commit
规范。 - 添加
hooks
代码提交前统一prettier格式化代码
-
Git flow
分支合并提交等是否加入权限控制
-
技术选型 技术栈统一
- 前端项目
- 框架选用
-
vue
-
React
-
- UI组件库选用
- PC端
Element ui
- 移动端
Vant
- 小程序端
uni-app
- PC端
- CSS预处理器
-
Scss
-
Less
-
Stylus
-
- 路由
-
Vue-router
-
- 状态管理
-
Vuex
-
- 国际化
-
vue-i18n
-
- 动画
-
Animate.css
-
Wow.js
-
Animista
-
Epic Spinners
-
- 服务端渲染
-
Nuxt.js
-
- 脚手架、CLI工具
- 集成多类项目基础模板
- 提供统一规范集成
- 提供基础通用组件库能力
- 集成底层全局统一更新
- 统一包管理工具
-
npm
-
yarn
-
pnpm
-
- 项目构建工具流
-
Webpack
,Vue-cli
-
- 开发工具
-
Vscode
-
- 框架选用
- 后端项目
- 框架
-
Hapi
-
- ORM
-
Sequelize
-
- 数据库
-
Mysql
-
Redis
-
- 通用env环境配置模板
- 抽离统一公共配置模板
- 如何保证添加数据库其他人能同时更新配置文件
- 框架
项目组织规范
- 通用的项目组织规范
- 待整理: 例如一个项目下需要
详细的Readme
,版本更新Readme
...
- 待整理: 例如一个项目下需要
- 目录组织的风格
- 例如
components
、constants
、typings
、views
- 例如
项目模板规范及通用模板抽离
-
qiankun微前端
抽离通用项目版本 -
后台管理系统通用模板
待集成 -
小程序基础通用项目版本
待集成 -
H5基础通用项目模板
待集成 - 抽离的模板需要
统一CodeReview
。 - 拥有单独特性的项目需要在业务完成后落地一套基础模板便于下次使用。
脚手架通用能力
- 维护所有通用基础模板,快速获取项目模板并创建项目
- 提供插件式注入能力保障基础模板的灵活扩展
技术文档规范
- 建立文档中心,统一文档保留地址与规范(TAPD WIKI)
- 统一文档格式,文档大纲。
- 定义文档模板,多种类型可定义多份
- 保留日常需求对接文档,保障需求交接的稳定性
- 代码注释即文档,需要添加必要的代码注释。
异常处理规范
- 前端日志
- 异常监控
前后端协作规范
双周分享 技术分享 新人培训
- 新人入职流程规范文档记录,保障入职流程顺畅
- 营造技术氛围,推动双周分享激励机制
- 落地分享内容,留存分享记录,提供分享文档