刘勇虎的官方网站

目录

• 目录
• 开发规范
  • 仓库分支管理：
  • 框架规范
  • JS 规范
  • 单文件组件规范
  • TS 规范
  • CSS
  • Vite 规范

开发规范

以下为 Vue 风格指南的补充，所以一定要去详读 Vue 风格指南

仓库分支管理：

• 默认 main/master 为主干分支，所有生产环境代码应该与主干分支同步

框架规范

操作：

•   项目应从 *.workspace 文件启动
•   样式文件优先使用 css, scss
•   公共组件在 src/components 路径下新建, 页面独有组件在 src/pages/[page_name]/components 下新建
•   页面独有信息应分别存在 src/pages/[page_name] 路径下, 如 src/pages/[page_name]/components/componet.vue , src/pages/[page_name]/apis/login.ts

样式文件导入:

•   在不确认是否全局通用的前提下样式标签中使用 scoped
•   使用 @use ‘xxx.scss’ as *; 代替 @import ‘xxx.scss’;因为 sass 团队说他们最终会删除 @import 语法。
•   文件使用路径应从 “@/“(src) 文件夹开始
•   不要在子组件中重复导入父组件中已存在的样式文件

npm registry :

•   https://registry.npmmirror.com/
•   https://maven.xpaas.domain.com/nexus/repository/npm/

文件夹 命名:

•   禁止大写 ,如果两个单词以上 , 可以直接小写或用’-‘链接 , 禁止出现重复文件夹名称或 重复文件夹名称 + 数字| ‘copy’字样，命名方式。禁止出现空格等特殊符号。
  文件 命名：
•   vue 文件与组件 name 应该驼峰命名，首字母大写。禁止出现空格等特殊符号。
•   其他文件除特殊要求之外，全部小写。

Git 相关：

•   git 分支名不可以大写, 分支管理有效管理
•   不可随意删除 .lock 文件 ,有冲突解决不了提前沟通

JS 规范

•   Window 事件监听禁止使用 onload ,应该使用 addEvenTListener
•   如果在组件中需要修改 props.<prop> 传过来的值，则必须解除 variable 与 props.<prop> 的响应关联，特别是 存在 v-model 的情况，注意保持 单向数据流;
•   自定义事件要求 驼峰命名，且命名应该表达简单详尽。
•   禁止使用 var 关键字
•   禁止使用 undefined
•   禁止无效变量
•   Promise 中 书写 try…catch , 并使用 console.error 打印相应错误
• 在执行过多逻辑代码块中，应该以 try…catch 包裹，并使用 console.error 打印相应错误
• 方法名应为小写字母开头
• 被除数应该检查不为零，且添加为零处理逻辑

单文件组件规范

• 所有绑定，应该声明对象，直接字面量方式，不容易后期维护。

TS 规范

• 任何方法应书写入参类型与出参类型.

• 禁止 **any** 的随便使用.
  

• 提倡使用 <PropType> 等类型推断.
  

CSS

•   所有 CSS 选择符必须由英文字母、数字或“-”下划线组成，必须以字母开头，不能为纯数字。设计者要用有意义的单词或缩写组合来命名选择符，做到“见其名知其意”，这样就节省了查找样式的时间。样式名必须能够表示样式的大概含义（禁止出现如 Div1、Div2、Style1 等命名）。

•   所有英文字母必须小写

•   尽量避免使用 vh ,vw

•   看板开发场景,使用 BiContainer组件下，除特殊需求外，应使用 px

Vite 规范

• 禁止代码中使用 import.meta.url 导入资源。