ESlint的格式化风格有很多种,选择哪一种作为自己的代码格式化风格呢?

这段时间刚刚复工,年前的我负责的一个年会大屏系统公司准备重新整理制作成为商城可售卖版本,然后又来了一个公司服务器租赁的 WebAPP 的项目,
我春节期间的外包项目也没有做完。那么给我自身 CodeReview 的时间就不够了,所以需要一个 ESLint 的通配规则来减少我编写的时候小失误,
虽然有自己的代码书写习惯,但是并没有强制要求自己,一直以来自己的 ESLint 配置仅具有错误预防功能,并没有使用一个通用的格式化风格,一直考虑的是使用 Airbnb config

趁着 CLI 在创建项目下载依赖的时间,我想选择一个规则作为我自己的以后的编码风格,
根据 CLI 给出的提示,默认可以配置的有三种:

第一个 Airbnb 我是知道的,后边两个我并不了解,所以去搜索了一下,但是并没有找到一篇详细说明每个规则各自的风格特点,
我就只能一个一个的去找,然后整理选择一个自己更喜欢的风格,并且保持下去。

先把三种风格分割出来,并且描述我了解到的一些会影响书写的规则特点:

Airbnb JavaScript Style

  • 使用两个空格经行缩进
  • 使用 const,let 避免使用 var
  • 字符串使用单引号
  • 函数使用小驼峰,结构体/类/单例/函数库/对象 时用大驼峰
  • 用字符串模板而不是字符串拼接 prefer-template template-curly-spacing
  • 字符串中禁用 eval()
  • 使用 object-shorthand 定义对象方法
  • 所有对象声明放在文档开始
  • 数组用字面量赋值 no-array-constructor,如果数组有很多行,在数组的 [ 后和 ] 前断行
  • 使用 ... (拓展运算符),而不是 Object.assign(还有一些别的例如:Array.from)
  • 用对象的解构赋值来获取和使用对象某个或多个属性值,数组同理 prefer-destructuring
  • 用命名函数表达式而不是函数声明 func-style
  • 用默认参数语法而不是在函数里对参数重新赋值。 function handleThings(opts = {}) { ... }
  • 导入语句在其他所有语句之前
  • 同模一个路径使用一个导入语句 import { myFunc1, myFunc2 } from 'module'
  • 不使用一元自增自减运算符 no-plusplus
  • 使用全等 === 摒弃 == (在需要检查 null || undefined 时可以使用 obj == null)eqeqeq
  • 布尔值用缩写,而字符串和数字要明确比较对象 if (collection.length > 0) { .. }
  • 三元表达式不应该嵌套
  • 大括号前增加空格 space-before-blocks
  • 关键字、函数名后加空格 keyword-spacing
  • 用空格来隔开运算符 space-infix-ops
  • 文件以回车结尾 eol-last
  • 方括号、圆括号里不要加空格
  • 花括号里加空格
  • 每个逗号后边都需要有空格
  • 调用函数时,函数名和圆括号之间不要空格
  • 空格添加在键值属性的冒号后 { 'key': 'value'}
  • 逗号不要前置,连接符.如果需要折行则前置
  • 需要结尾逗号

JavaScript Standard Style

  • 使用两个空格进行缩进
  • 变量、函数使用小驼峰命名,构造函数大驼峰命名
  • 字符串使用单引号(需要转义的地方除外)
  • 模板字符串中没有空格 template-curly-spacing
  • 字符串中禁用 eval()
  • 关键字、函数名后加空格 keyword-spacing
  • 使用全等 === 摒弃 == (在需要检查 null || undefined 时可以使用 obj == null)eqeqeq
  • 不使用分号
  • 方括号、圆括号里不要加空格
  • 花括号里加空格 function foo () { return true }
  • 用空格来隔开运算符 space-infix-ops
  • 调用函数时,函数名和圆括号之间不要空格
  • 数组用字面量赋值 no-array-constructor
  • 每个逗号后边都需要有空格
  • 不需要结尾逗号
  • 空格添加在键值属性的冒号后 { 'key': 'value'}
  • 不使用 debugger
  • 禁止扩展 Object 原型
  • 同模一个路径使用一个导入语句 import { myFunc1, myFunc2 } from 'module'
  • 文件以回车结尾 eol-last

Prettier

并不用考虑书写格式,在文档保存时自动帮你把代码格式化为他们所规定的格式。

全文未完成 2020/02/20

感觉规则太乱不方便查看,我按照类别拆分开才行,按照类型还是操作区分还没考虑好。

例如按照类型:对象,数组,函数,字符串….
按照操作:书写格式(缩进,命名,符号),表达式规则….

eslint 在线规则配置