Skip to content

前端规范

2.1 代码检查工具及常见规范

  1. 代码检测工具: 采用 ESLint 作为代码规范化工具
  2. 命名规范:
  • 变量的命名采用驼峰命名法,与后端实体保持完全一致
  • 包的命名采用横线命名法(如: personal-center)
  1. 注释规范:与后端保持一致,行前注释,行后不注释
  2. 编码习惯:
  • 使用 let 代替 var 声明变量,使用 const 声明常量
  • 使用 === 代替 == 进行判等操作,=== 判等包括数据类型的判等,=== ==用于一般比较,===用于严格比较,==在比较的时候可以转换数据类型,===严格比较,只要类型不匹配就返回 flase。
  • 当使用变量来固定 this 时,统一命名为 vm

2.2 结构规范及编码逻辑

  1. 组件间状态交互原则: 若非必须,不要使用 store 进行状态管理,父子组件或则祖先组件与子组件交互时,尽量使用 props 与 provide/inject
  2. 前后端交互代码位置: 严禁将 http 请求,业务逻辑写在 store 中,必须确保 store 代码功能的纯净性,即只用于状态管理。 http 请求统一写在 api 层
  3. 前端项目各层级功能划分:
  • 前后端交互 api
  • 静态资源 assets
  • 实用工具函数 libs
  • 自定义实用组件 components
  • 路由 router
  • 前端状态管理仓库 store
  • 样式 style
  • 功能展示以及示例代码 sample
  • 业务界面 views