命名规范 # Jobs by vuejobs.com规范的目的是为了编写高质量的代码,降低沟通成本,提高团队合作开发的效率,最终让大家每个人都可以写出一套漂亮整洁的代码。参考官方文档
规范方式
帕斯卡拼写法,英文为PascalCase,特点是所有连接单词的首字母大写,可以简称为大坨峰 骆驼拼写法,英文为camelCase,特点是第一个连接的单词的首字母小写,其余大写,可以简称为小坨峰;短横拼写法,英文为kebab-case,特点是所有连接的单词以中划线(-)连接,可以简称为中划线。文件和文件夹中除components中组件文件夹要使用 大坨峰规则外,其他文件和文件夹都为中划线分隔。整体规范 #命名不可使用中文拼音
字母统一小写,专有名词可大写
共性在前,个性在后
语义要清楚完整,不要过分简写
命名严谨性 #与后端命名统一。比如权限:后端privilege, 前端无论router , store, api等都必须使用privilege单词!
文件和代码中的命名严禁使用拼音与英文混合的方式,更不允许直接使用中文的方式。 正确的英文拼写和语法可以让阅读者易于理解,避免歧义。 注:beijing、henan、rmb 等国际通用的名称,可视同英文。
项目命名 #字母组成,中划线拼接,全部采用小写方式,以中划线分隔。前面为项目英文名称,后面为项目的类型。尽量不要用mall-management-system,因为被后台占用。
示例:traffic-security-pc、travel-uni-app、mall-management-h5、mall-management-wx
目录(文件夹)命名 #文件夹代表着功能或者模块的名字,应该简洁明了。 除components组件目录,使用大坨峰命名, node_modules 依赖外,其余全部采用字母组成,中划线拼接。 有复数结构时,要采用复数命名法
普通示例:
scripts/、styles/、images/、utils/、layouts、company-news/、img/、js/、doc/、api/、order/
特殊:
node_modules示例:node_modules/、 components示例:SvgIcon、Upload、TestUnit
文件命名 #文件包括.js .css .html .vue .sass .less 图片等文件
字母组成,中划线拼接
例:sass-index.scss dialog-user-info.vue
组件命名 #声明&使用:首字母大写,驼峰拼接
js// 声明
import DialogUserInfo form '@/components/dialog-user-info'
components: {
DialogUserInfo
}
// 使用
css命名 #字母组成,中划线拼接 id采用驼峰式命名
例:.color-white #theDialog
js命名 #变量&函数 #常量:大写字母、数字组成,下划线拼接,例:CONSULT_TYPE 私有变量:字母、数字组成,驼峰拼接,下划线开头,例:_self 普通变量:字母、数字组成,驼峰拼接,例:idCard 构造函数:字母组成,驼峰拼接,首字母大写,例:Vue() 普通函数:字母组成,驼峰拼接,动词+名词方式组合,例:getList()
形参 #形参本身是可以任意定义的,统一是为了更方便地复用/合并代码
参数含义用法示例i索引switchTab(i) {}e事件focusHandler(e) {}v基本类型值setData(v) {}obj对象let arr = mainList.filter(obj => obj.isCheck)arr数组let arr = Array.from(obj)fun函数callback(fun) {}item列表项jumpDetail(item) {}elementforEach的项forEach(element=>{})key,value键值对for (let [key, value] of arr) {}