ShuoYe Standard

朔夜项目使用的JS Linter。在Standard JS的基础上，做了部分改动。

参考

• ESLint Config Standard

注意

目前，由于ESLint的问题，对于?号操作符多行模式下的缩进会报错，需要使用/* eslint-disable /*来关闭相关校验，相关Issue。

// this is the correct style, but `standard` will complain
/* eslint-disable */
const A = condition ?
  [
    1,
    2,
    3,
  ]
  :
  [
    4,
    5,
    6,
  ]
/* eslint-enable */

安装配置

使用husky配置@shuoye/standard作为pre-commit的钩子，推荐使用snazzy来美化输出。

yarn add -D husky
yarn add -D @shuoye/standard
yarn add -D snazzy

// vim package.json
{
  "scripts": {
    "precommit": "standard src/**/*.{js,jsx,vue} | snazzy"
  }
}

规则

在standard的基础上，做了如下改动和修改。

• 引号使用双引号而不是单引号（quotes）

• 数组，对象等如果跨行，末尾一定要有逗号（comma-dangle）

• 函数名和函数参数之间不需要空格，除了asyncArrow

  // bad
  function a () {...}
  var a = function () {...}
  var b = async() => {...}
  
  // good
  function a() {...}
  var a = function() {...}
  var b = async () => {...}

• 关键词前后都需要添加空格，除了if，switch，for, catch后不需要添加空格。

  // bad
  if (...) {...}
  
  if() {
      ...
  } else{...}
  
  if() {
  
  }else {...}
  
  for () {
    ...
  }
  
  try {
  
  } catch (err) {
  
  }
  
  // good
  if() {...}
  
  if() {
  
  } else {...}
  
  for() {
    ...
  }
  
  try {
  
  } catch(err) {
  
  }

• 默认使用eslint-babel作为parser，主要是默认parser目前不支持Class Property，而这个特性很有用。

• ?和:这两个操作符的换行规则比较特殊，如果比较短，那么全部在一行，如果比较长，?后跟一个换行，而:前后都跟上一个换行。

  var a = short ? var1 : var2
  var b = long ?
    var3
    :
    var4

全局变量

所有的全局变量应该都带有window前缀，除了document和navigator。如果因为某些原因引入了全局变量，必须要告知Standard，否则将会报错。

• 在文件顶部添加如下备注

  /* global var1, var2 */

• 向package.json中添加如下内容

  "standard": {
    "globals": ["var1", "var2"]
  }

禁用检查

在某些情况下，需要禁用样式检查，具体请看ESLint disabling rules文档。简单来说，有两种方式。

1. 使用eslint-disable-line注释来禁止检查某一行。

// 下面这一行不会进行样式检查
var a   = 100 // eslint-disable-line 

2. 使用eslint-disable和eslint-enable注释来禁止检查某一段区域的代码。

// 下面这段被注释包裹的代码都不会进行样式检查
/* eslint-disable */
var a   = 100
var b   = 200
...
/* eslint-enable */