前端开发规范-技术规范,编码规范,版本控制,上线,与PM沟通要注意的问题

技术规范

命名规范

• 目录、文件、变量、函数等驼峰式
• html 标签、属性等，全小写，短线-分隔
• css 类名、id 等，全⼩写，短线-分隔 文件名与⽬录名保持一致

目录规范

• src ⽬目录结构

  • api 接⼝口封装

    • \ 按模块划分⽂文件

    • |- user.js

    • |- im.js ...

  • assets 小于 10k 的静态资源 (大于 10k 的走服务端 CDN)

    • \ 按模块或⻚页⾯面划分⼦子⽬目录

    • |- base

    • |- user

    • |- im

    • ...

  • base 基础组件 按模块划分子目录

  • common 通⽤用资源

    • \

    • |- css 通⽤用样式

      • \

      • |- base.css 基础样式

    • |- js 通用逻辑

      • \
      • |- config.js 配置文件
      • |- util.js ⼯具方法

  • components 业务组件 按模块或⻚面划分子⽬录

  • pages ⻚面 按⻚面层级划分⼦目录

  • router 路由跳转/vue-router

  • store localStorage/vuex

  • app 相关文件

编码规范

• eslint eslint.cn/docs/rules/

版本控制

• 主⼲开发 ⽆分⽀
• 功能、模块开发完成后尽快提交，减少冲突
• 提交的代码必须通过自测，避免影响其他人的开发调试

上线

• 线上无小事，请谨慎上线

  • bug、回滚会影响 KPI

• 所有发布的版本，都要保证是可上线的

• 上线后，立即自测，确认功能是否正常，通知相关同事

与 PM 沟通要注意的问题

• 不单独接受 PM 提的新需求(bug 除外)，所有新需求先发产品技术通报群