前端开发规范.pdfVIP

目 录 Vue开发规范 基于模块开发 组件 组件命名规则 基础组件名 单例组件名 紧密耦合的组件名 组件名中的单词顺序 组件文件夹命名规则 method方法 methods方法命名规则 组件结构化 组件事件命名规则 v-for与v-if 为 v-for 设置键值 避免 v-if 和 v-for 用在一起 Prop Prop命名规则 Prop定义 避免 this.$parent 谨慎使用 this.$refs 隐性的父子组件通信 元素 元素特性的顺序 多个特性的元素摆放规则 单文件组件的顶级元素的顺序 简化代码 模板中简单的表达式 简单的计算属性 指令缩写 文件引用路径 其他注意 组件数据 将 this 赋值给 component 变量 对组件文件进行代码校验 尽可能使用 mixins 非 Flux 的全局状态管理 只在需要时创建组件 HTML开发规范 本文档使用 看云 构建 - 2 - HTML语法 HTML5 doctype 语言属性 IE 兼容模式 字符编码 引入 CSS 和 JavaScript 文件 实用为王 属性顺序 布尔 （boolean ）型属性 减少标签的数量 JavaScript 生成的标签 CSS开发规范 CSS语法 声明顺序 不要使用 @import 媒体查询 （Media query ）的位置 带前缀的属性 单行规则声明 简写形式的属性声明 Less 和 Sass 中的嵌套 Less 和 Sass 中的操作符 注释 class 命名 选择器 代码组织 本文档使用 看云 构建 - 3 - Vue开发规范 Vue开发规范 Vue前端开发规范 使用之前请注意以下几点 ： 尽量参照文档内的说明来 不清楚的地方及时询问 若部分规则没有定义或有错误 ，及时提出 ，修改后按照新规则来 编辑于2018-05-24 本文档使用 看云 构建 - 4 - 基于模块开发 基于模块开发 始终基于模块的方式来构建你的 app ，每一个子模块只做一件事情。 Vue.js 的设计初衷就是帮助开发者更好的开发界面模块。一个模块是应用程序中独立的一个部分。 怎么做 ？ 每一个 Vue 组件 （等同于模块 ）首先必须专注于解决一个单一的问题 ，独立的、可复用的、微小的 和 可 测试的。 如果你的组件做了太多的事或是变得臃肿 ，请将其拆分成更小的组件并保持单一的原则。 一般来说 ，尽量保证每一个文件的代码行数不要超过 100 行。 也请保证组件可独立的运行。 比较好的做法是增加一个单独的 demo 示例。 本文档使用 看云 构建