1. 要求使用拖尾逗号(comma-dangle)

详细讲解请看comma-dangle

配置文件代码:

    // require trailing commas in multiline object literals
    'comma-dangle': ['error', {
      arrays: 'always-multiline',
      objects: 'always-multiline',
      imports: 'always-multiline',
      exports: 'always-multiline',
      functions: 'always-multiline',
    }],
  • "never": (默认) 禁用拖尾逗号
  • "always": 要求使用拖尾逗号
  • "always-multiline": 当最后一个元素或属性与闭括号 ] 或 } 在 不同的行时,要求使用拖尾逗号;当在 同一行时,禁止使用拖尾逗号。
  • "only-multiline": 当最后一个元素或属性与闭括号 ] 或 } 在 不同的行时,允许(但不要求)使用拖尾逗号;当在 同一行时,禁止使用拖尾逗号。

Airbnb 使用的是always-multiline模式

错误示例代码:

var foo = {
    bar: "baz",
    qux: "quux"
};

正确示例代码:

var foo = {
    bar: "baz",
    qux: "quux",
};

2. 句尾要求使用分号(semi)

详细讲解请看semi

配置文件代码:

// require or disallow use of semicolons instead of ASI \
semi: ['error', 'always'],

  • "always" (默认) 要求在语句末尾使用分号。

错误代码示例:

/*eslint semi: ["error", "always"]*/

var name = "ESLint"

object.method = function() {
    // ...
}

正确代码示例:

/*eslint semi: "error"*/

var name = "ESLint";

object.method = function() {
    // ...
};

3. 强制使用一致的缩进 (indent)

详细请看indent具体讲解

配置文件代码:

    // this option sets a specific tab width for your code
    // http://eslint.org/docs/rules/indent
    indent: ['error', 2, { //多行首行缩进两个空格
      // switch语句,case要缩进两个空格
      SwitchCase: 1, 
      //如果缩进设置为 2 个空格,VariableDeclarator 设置为 1,多行变量声明将会缩进 2 个空格
      VariableDeclarator: 1, 
      //if语句块缩进两个空格
      outerIIFEBody: 1,
      // MemberExpression: null,
      // CallExpression: {
        // parameters: null,
      // },
      //function语句块缩进两个空格(参数和body都是)
      FunctionDeclaration: {
        parameters: 1,
        body: 1
      },
      //function表达式进两个空格(参数和body都是)
      FunctionExpression: {
        parameters: 1,
        body: 1
      }
    }],

4. 强制在模块顶部调用require() (global-require)

详细介绍请看global-require

配置文件代码:

    // require all requires be top-level
    // http://eslint.org/docs/rules/global-require
    'global-require': 'error',

此规则要求所有调用 require() 必须在模块顶部,与 ES6 中 import 和 export 语句(只能放在顶部)相同。

  • 错误 代码示例:
/*eslint global-require: "error"*/
/*eslint-env es6*/

// calling require() inside of a function is not allowed
function readFile(filename, callback) {
    var fs = require('fs');
    fs.readFile(filename, callback)
}

// conditional requires like this are also not allowed
if (DEBUG) { require('debug'); }

// a require() in a switch statement is also flagged
switch(x) { case '1': require('1'); break; }

// you may not require() inside an arrow function body
var getModule = (name) => require(name);

// you may not require() inside of a function body as well
function getModule(name) { return require(name); }

// you may not require() inside of a try/catch block
try {
    require(unsafeModule);
} catch(e) {
    console.log(e);
}
  • 正确 代码示例:
/*eslint global-require: "error"*/

// all these variations of require() are ok
require('x');
var y = require('y');
var z;
z = require('z').initialize();

// requiring a module and using it in a function is ok
var fs = require('fs');
function readFile(filename, callback) {
    fs.readFile(filename, callback)
}

// you can use a ternary to determine which module to require
var logger = DEBUG ? require('dev-logger') : require('logger');

// if you want you can require() at the end of your module
function doSomethingA() {}
function doSomethingB() {}
var x = require("x"),
    z = require("z");

5. 要求驼峰拼写法 (camelcase)

详细介绍请看camelcase

配置文件代码:

// require camel case names
camelcase: ['error', { properties: 'never' }],

要求:所有名称驼峰拼写法命名,属性名除外


6. 强制在花括号中使用一致的空格 (object-curly-spacing)

详细介绍请看object-curly-spacing

配置文件代码:

// require padding inside curly braces
'object-curly-spacing': ['error', 'always'],

"always" 要求花括号内有空格 (除了 {})

  • 选项 "always" 的 错误 代码示例:
/* eslint object-curly-spacing: ["error", "always"] */
var obj = {'foo': 'bar'};  
var obj = {'foo': 'bar' };  
var obj = { baz: {'foo': 'qux'}, bar};  
var obj = {baz: { 'foo': 'qux' }, bar};  
var obj = {'foo': 'bar'  
};  
var obj = {  
  'foo':'bar'};  
var {x} = y;  
import {foo } from 'bar';
  • 选项 "always" 的 正确 代码示例:
/* eslint object-curly-spacing: ["error", "always"] */

var obj = {};  
var obj = { 'foo': 'bar' };  
var obj = { 'foo': { 'bar': 'baz' }, 'qux': 'quxx' };  
var obj = {  
  'foo': 'bar'  
};  
var { x } = y;  
import { foo } from 'bar';

7. 强制使用一致的反勾号、双引号或单引号 (quotes)

详细介绍请看quotes

配置文件代码:

// specify whether double or single quotes should be used  
quotes: ['error', 'single', { avoidEscape: true }],

"single" 要求尽可能地使用==单引号==\ "avoidEscape": true 允许字符串使用单引号或双引号,只要字符串中包含了一个其它引号,否则需要转义

选项 "single" 的 错误 代码示例:

/* eslint quotes: \["error", "single"\] */

var double = "double";  
var unescaped = "a string containing 'single' quotes";

选项 "single" 的 正确 代码示例:

/* eslint quotes: ["error", "single"] */  
/* eslint-env es6 */

var single = 'single';  
var backtick = `back${x}tick`; // backticks are allowed due to substitution

选项 "double", { "avoidEscape": true } 的 正确 代码示例:

1.

/* eslint quotes: ["error", "double", { "avoidEscape": true }] */

var single = 'a string containing "double" quotes';

2.

/* eslint quotes: ["error", "single", { "avoidEscape": true }] */

var double = "a string containing 'single' quotes";

3.

/* eslint quotes: ["error", "backtick", { "avoidEscape": true }] */

var double = "a string containing `backtick` quotes"

results matching ""

    No results matching ""