[强制] switch 下的 case 和 default 必须增加一个缩进层级。
// good switch (variable) { case '1': // do... break; case '2': // do... break; default: // do... } // bad switch (variable) { case '1': // do... break; case '2': // do... break; default: // do... }规范文档:
网易编码规范:CSS规范:一系列规则和方法,帮助你架构并管理好样式
HTML规范:一系列建议和方法,帮助你搭建简洁严谨的结构
工程师规范:前端页面开发工程师的工作流程和团队协作规范
但是并不止于此,还有更多:
JavaScript Standard Style除很多公司组织外,很多个人也在项目中使用的规范。
https://github.com/standard/standard
Vue这里是官方的 Vue 特有代码的风格指南。
如果在工程中使用 Vue,为了回避错误、小纠结和反模式,该指南是份不错的参考。
不过我们也不确信风格指南的所有内容对于所有的团队或工程都是理想的。
所以根据过去的经验、周围的技术栈、个人价值观做出有意义的偏差是可取的。
官方风格指南: https://cn.vuejs.org/v2/style-guide/index.html
es6如何将 ES6 的新语法,运用到编码实践之中,与传统的 JavaScript 语法结合在一起,写出合理的、易于阅读和维护的代码。
es6 编程风格:
Bootstrap内容包含 HTML 和 CSS。
HTML
语法、HTML5 doctype、语言属性、IE 兼容模式、字符编码、引入 CSS 和 JavaScript 文件、实用为王、属性顺序、布尔型属性、减少标签的数量、JavaScript 生成的标签。
CSS
语法、声明顺序、不要使用 @import、媒体查询(Media query)的位置、带前缀的属性、单行规则声明、简写形式的属性声明、Less 和 Sass 中的嵌套、Less 和 Sass 中的操作符、注释、class 命名、选择器、代码组织。
Bootstrap 编码规范:https://codeguide.bootcss.com/
ESLint目前绝大多数前端项目都会用到的 可组装的 JavaScrip t和 JSX 检查工具。
发现问题
ESLint 静态分析您的代码以快速发现问题。ESLint 内置于大多数文本编辑器中,您可以将ESLint 作为持续集成管道的一部分运行。
自动修复
ESLint 发现的许多问题都可以自动修复。ESLint 修复程序可识别语法,因此您不会遇到传统的查找和替换算法引入的错误。
定制
预处理代码,使用自定义解析器,并编写与 ESLint 内置规则一起使用的自己的规则。您可以自定义 ESLint,使其完全按照项目所需的方式工作。
ESLint: https://eslint.org/
ESLint 中文网:https://eslint.bootcss.com/
PrettierPrettier 是一个“有主见”的代码格式化工具。
简而言之,这个工具能够使输出代码保持风格一致。
也是目前绝大多数前端项目都会用到的哦。
Prettier:https://prettier.io/
最后好了,【前端GitHub】的第 5 期内容已经讲完了,更多精彩请看下方仓库地址:
原文地址:https://github.com/FrontEndGitHub/FrontEndGitHub