标签：tpm   计算属性   base   验证   route   页面   key   ref   指令   

一、命名规范

1.项目命名：小写方式，以中划线分隔。

mall-management-system

2.目录命名：小写方式，以中划线分隔，有复数结构时，要采用复数命名法，缩写不用复数。

正例： scripts / styles / components / images / utils / layouts / demo-styles / demoscripts / img / doc

3.vue项目中的compontes中的组件目录，使用kebab-case命名

head-search/page-loading

4.js、css、scss、html、png等文件命名。

全部采用小写方式，以中划线分隔

render-dom.js/sign-up.css/index.html/company-logo.png

5.严谨使用中文‘拼音命名

6.杜绝完全不规范的缩写，避免望文不知义

二、HTML命名规范

1.html类型

1.1 缩进使用2个空格

1.2 优先使用语义化标签，避免一个页面都是div或者p标签

1.3 使用双引号而不是单引号

2.css规范

2.1 类名使用小写字母，以中划线分隔

ID和class的名称总是使用可以反映元素目的和用途的名称。

2.2 选择器

使用直接子选择器

2.3 每个选择器以及属性独占一行

2.4 写css的时候省略0后面的单位0px,写作0.

3.less规范

3.1公共的less文件放置在style/less/common文件夹

3.2按以下顺序组织

• @import
• 变量声明
• 样式声明

3.3避免嵌套层级过多

4. javaScript规范

4.1文件命名

使用小写驼峰命名lowerCamelCase

4.2方法名、参数名、成员变量、局部变量都统一使用小驼形式

比如：localVlaue/getHttpMessaage()/inputUserId其中method方法savaShopCarData

增删改查、详情统一使用add/delete/update/get/detail

字符串统一使用单引号，不使用双引号

4.3 优先使用es6中的语法

比如说箭头函数（）=>{}/await async/解构/let/for...of等

4.4多用大括号和括号

4.5条件判断和循环最多三层

三、Vue项目规范

3.1 组件名kebabCase命名：my-component.vue

3.2 基础组件名为base开头，使用完整单词而不是缩写

3.3 和父组件紧密耦合的子组件应该以父组件名作为前缀命名

3.4 在Template模板中使用组件，应使用大驼峰命名，并且使用自闭和组件

前端开发规范

标签：tpm   计算属性   base   验证   route   页面   key   ref   指令   

原文地址：https://www.cnblogs.com/ma1998/p/14315850.html