团队前端开发规范

199 阅读1分钟

团队前端开发规范

前言

目前有些规范已经明确,有些还需要讨论和实践后得出最佳的规范,这部分会标示待确认。

typescript or javascript?

新项目使用typescript开发

原因:当项目逐渐庞大后,ts会使得项目更可维护。

前端框架选择

vue.js

原因:取了现有开发人员的技术栈交集

项目结构

待定

编码规范

不详细展开,保持统一,使用如下内容的.eslintrc.json

{
  "extends": [
    "eslint:recommended",
    "plugin:vue/essential",
    "plugin:prettier/recommended"
  ],
  "rules": {
    "prettier/prettier": "error"
  },
  "plugins": ["vue"]
}

打包工具

  • yarn
  • webpack4

私有化npm包

使用sonar type nexus3的npm repo,部署一个npm proxy

原因:缓存npm包和维护公司内部的偏业务ui组件库和一些工具库

私有化组件管理工具

storybook? (待定)

后端接口约定

mock和格式约定
后端给出接口对应的yapi的文档地址,入参和出参需描述清楚,如不能明显根据字段名看出语义,需后端标示字段备注。

状态码
直接使用http status code作为接口返回状态的判断依据

分页入参和出参 如果接口需要有分页效果,前后端入参中会有:

{
    
    "current": Integer, // 当前第几页,从1开始
    "pageSize": Integer // 每页显示条数
}

出参中需要返回一个pagination为key的对象字面量(包含了total字段),平行于返回的数据字段,例如:

// 返回的response body
{
    "data": [{a:1,b:2}...],
    "pagination": {
        total: Integer
    }
}

测试环境部署方式

待定

生产发布

需求管理

问题修复流程