文件的命名
以最少的字母达到最容易理解的意义。
索引文件统一使用index.html文件名(小写) index.html文件统一作为"桥页",不制作具体内容,仅仅作为跳转页和meta标签页。主内容页为main.html。
按菜单名的英语翻译取单一单词为名称。所有单英文单词文件名都必须为小写,所有组合英文单词文件名第二个起第一个字母大写; 所有文件名字母间连线都为下划线。
例如: 关于我们 \aboutus
信息反馈 \feedback
产 品 \product
图片的命名
以图片英语字母为名。以最少的字母达到最容易理解的意义。
对于较小的图片,我们使用如下格式的命名 :
sm.kahn.gif
其中,sm 代表“small”,kahn 代表图片的内容。较大图像的命名规则也一样,不过是以 bg 开头的:
bg.kahn.gif
用以区分不同图像的命名规则应当是全站通用的,这样可以尽量避免将不同的名称搅混。
网站目录的命名
目录建立的原则是以最少的层次提供最清晰简便的访问结构。
服务器的ftp上传目录默认为html 根目录文件 根目录只允许存放index.html和main.html文件,以及其他必须的系统文件。
每个语言版本存放于独立的目录。已有版本语言设置为: 简体中文 \gb 繁体中文 \big5 英 语 \en 日 语 \jp 每个主要功能(主菜单)建立一个相应的独立目录。 根目录下的images为存放公用图片目录,每个目录下私有图片存放于各自独立images目录.
例如: \menu1\images
\menu2\images
另外,所有的js文件存放在根目录下统一目录\script 所有的CSS文件存放在根目录下的style目录 所有的CGI程序存放在根目录并列目录\cgi_bin目录。
对于一些信息更新量比较大的站点或是栏目,还可以采用一种更为特殊的方式来进行文件架的命名,这样能使得日后的维护更加方便,这样的方式就是使用“单一单词命名的目录”+“年年年年_月月_日日”的方式命名,最后的“日日”是根据更新量大小可选择的,如果每日更新量很大则可以加上“日日”。
例如: \news\2005_08\
\news\2005_09\
\news\2005_10_12\
前端规范一(命名规范)
1、小驼峰命名法(lowerCamelCase) :第一个单词以小写字母开始,第二个单词的首字母大写,例如:firstName、lastName。
2、大驼峰命名法(CamelCase) :每一个单词的首字母都采用大写字母,例如:FirstName、LastName。
3、下划线命名法(snake_case):下划线命名法也叫蛇形法,全由小写字母和下划线组成,在两个单词之间用下滑线连接。例如:first_name。
4、中划线命名法(kebab-case):中划线命名法也叫串式命名法,各个单词之间通过下划线“-”连接。例如:first-name。
强制使用:中划线命名法
命名规则:1、文件名不得含有空格
2、文件名建议只使用小写字母,不使用大写字母
3、文件名包含多个单词时,单词之间建议连词线 ( - ) 分隔
4、有复数结构式,要使用复数
示例:login 、 error-page、 icons
强制使用:全部大写字母
为了醒目,某些说明文件的文件名,可以使用大写字母
示例:README
补充说明: README 标准
◎ 项目简介。
◎ 注意事项。
◎ 线上的示例地址(测试、正式)。
◎ 支持运行的环境。
◎ 必要的依赖准备,以及如何搭建。
◎ 项目的安装指南。
◎ 相关的文档链接。
◎ 相关人员的联系方式。
README.md 示例:
强制使用:小驼峰命名法
命名规则:前缀为动词,见名知意
1、onXxx 监听事件的回调
2、handleXxx 处理事件
3、getXxx 获取某个值
4、setXxx 设置某个值
常见场景:
a、事件处理:
(1).事件主动监听采用 onXxx ,被动处理使用handleXxx
示例:onXxxSubmit: '提交表单'
handleXxxSizeChange: '处理分页页数改变'
handleXxxPageChange: '处理分页每页大小改变'
onXxxKeydown: '按下键'
(2). 其他命名:元素+click、 元素+change、select+范围
示例:selectAllXxx: '选择所有'
xxxCellClick: '当某个单元格被点击时会触发该事件'
xxxSortChange: '当表格的排序条件发生变化的时候会触发该事件'
b、增删改查处理:
增: addXxx 添加子项
createXxx 创建大项
删: deleteXxx 真删除
removeXxx 伪删除
改:updateXxx
查: getXxx 获取原始数据需要修改
fetchXxx 原始数据
示例:getUserList: '获取用户列表', fetchToken: '取得Token', deleteUser: '删除用户', removeTag: '移除标签', updateUserInfo: '更新用户信息', addUser: '添加用户', createAccount: '创建账户'
c、API接口函数:
get: getXxxApi
post: postXxxApi
patch: patchXxxApi
delect: delectXxxApi
域名:xxxUrl
一般属性变量 强制使用:小驼峰命名法
1、布尔值
命名规则:前缀为判断性动词
hasXxx 判断是否含有某个值。true:含有此值; false:不含有此值
isXxx 判断是否为某个值。true:为某个值; false:不为某个值
示例:isShow: '是否显示', isLoading: '是否处于加载中', hasToken: '是否包含Token',
2、数组命名
命名规则:使用名词+List组合
示例: userList: '用户列表'
3、私有属性变量
命名规则:前缀为下划线(_)后面和变量命名一样。
4、枚举变量 \textcolor{red}{强制使用:大驼峰命名法}
枚举的属性使用全大写字母,单词间用下划线隔开。
示例:let TargetState = { READING: 1, READED: 2, APPLIED: 3, READY: 4 }
5、常量: 强制使用:使用全大写字母,单词间用下划线隔开
强制使用:大驼峰命名法
命名规则: 可参考vue官网风格指南
例如: 1、按照功能来命名
2、应用特定样式和约定的基础组件 (也就是展示类的、无逻辑的或无状态的组件) 应该全部以一个特定的前缀开头,比如 Base、App 或 V。
3、组件名应该以高级别的 (通常是一般化描述的) 单词开头,以描述性的修饰词结尾。
示例:components/
|- BaseButton.vue
|- BaseTable.vue
|- BaseIcon.vue
强制使用: 中划线命名法
命名规则:
1.class、id 、标签、属性的命名应该尽量精短、明确,必须以字母开头命名,且全部字母为小写,单词之间统一使用中划线 “-” 连接
2.class必须代表相应模块或部件的内容或功能,不得以样式信息进行命名。
3.元素 id 必须保证页面唯一。
4.禁止创建无样式信息的 class
示例:
1、尽量不要缩写、简写的单词。除了 template =>tmp、message =>msg、image =>img、property =>prop 这些单词已经被公认的缩写
2、可读性强的命名优先于简短的命名
3、命名长度最好在 20 个字符以内,避免多长带来的阅读不便
4、命名要有具体的含义,避免使用一些泛指和无具体含义的词
5、不要使用拼音,更不要使用中文
6、正则表达式用 Exp 结尾
7、ref:使用Ref结尾