Versions Compared

Version Old Version 3 New Version Current
Changes made by

Anastasia Hahanova

Oleksandr Yehorov

Saved on

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

key-spacing

currently: "key-spacing": "off"

  • beforeColon

Examples of incorrect code for this rule with the default { "beforeColon": false } option:

Code Block
/*eslint key-spacing: ["error", { "beforeColon": false }]*/
var obj = { "foo" : 42 };

Examples of correct code for this rule with the default { "beforeColon": false } option:

Code Block
/*eslint key-spacing: ["error", { "beforeColon": false }]*/
var obj = { "foo": 42 };

  • afterColon

Examples of incorrect code for this rule with the default { "afterColon": true } option:

Code Block
/*eslint key-spacing: ["error", { "afterColon": true }]*/
var obj = { "foo":42 };

Examples of correct code for this rule with the default { "afterColon": true } option:

Code Block
/*eslint key-spacing: ["error", { "afterColon": true }]*/
var obj = { "foo": 42 };

padding-line-between-statements

  • one or more blank lines are required between a variable declaration and a return statement.

Examples of incorrect code for the [{ blankLine: "always", prev: "*", next: "return" }] configuration:

Code Block
/*eslint padding-line-between-statements: [
    "error",
    { blankLine: "always", prev: "*", next: "return" }
]*/

function foo() {
    bar();
    return;
}

Examples of correct code for the [{ blankLine: "always", prev: "*", next: "return" }]configuration:

Code Block
/*eslint padding-line-between-statements: [
    "error",
    { blankLine: "always", prev: "*", next: "return" }
]*/

function foo() {
    bar();

    return;
}

function foo() {
    return;
}

  • This configuration would require blank lines after every sequence of variable declarations, like the newline-after-var rule.

Examples of incorrect code for the [{ blankLine: "always", prev: ["const", "let", "var"], next: "*"}, { blankLine: "any", prev: ["const", "let", "var"], next: ["const", "let", "var"]}] configuration:

Code Block
/*eslint padding-line-between-statements: [
    "error",
    { blankLine: "always", prev: ["const", "let", "var"], next: "*"},
    { blankLine: "any",    prev: ["const", "let", "var"], next: ["const", "let", "var"]}
]*/

function foo() {
    var a = 0;
    var b = 0;
    bar();
}

function foo() {
    let a = 0;
    const b = 0;
    bar();
}

function foo() {
    const a = 0;
    const b = 0;
    bar();
}

Examples of correct code for the [{ blankLine: "always", prev: ["const", "let", "var"], next: "*"}, { blankLine: "any", prev: ["const", "let", "var"], next: ["const", "let", "var"]}] configuration:

Code Block
/*eslint padding-line-between-statements: [
    "error",
    { blankLine: "always", prev: ["const", "let", "var"], next: "*"},
    { blankLine: "any",    prev: ["const", "let", "var"], next: ["const", "let", "var"]}
]*/

function foo() {
    var a = 0;
    var b = 0;

    bar();
}

function foo() {
    let a = 0;
    const b = 0;

    bar();
}

function foo() {
    const a = 0;
    const b = 0;

    bar();
}

comma-dangle

currently: 

Code Block
/*"only-multiline" allows (but does not require) trailing commas when the last element or property is 
in a different line than the closing ] or } and disallows trailing commas when the last element or property 
is on the same line as the closing ] or }*/
"comma-dangle": [
	"error",
	{
		"arrays": "only-multiline",
		"objects": "only-multiline",
		"imports": "only-multiline",
		"exports": "only-multiline",
		"functions": "only-multiline"
	}
]

  • always-multiline

Examples of incorrect code for this rule with the "always-multiline" option:

Code Block
/*eslint comma-dangle: ["error", "always-multiline"]*/

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

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

var arr = [1,2,];

var arr = [1,
    2,];

var arr = [
    1,
    2
];

foo({
  bar: "baz",
  qux: "quux"
});

Examples of correct code for this rule with the "always-multiline" option:

Code Block
/*eslint comma-dangle: ["error", "always-multiline"]*/

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

var foo = {bar: "baz", qux: "quux"};
var arr = [1,2];

var arr = [1,
    2];

var arr = [
    1,
    2,
];

foo({
  bar: "baz",
  qux: "quux",
});

max-len

For Folio-project "code: 120" is recommended

Examples of incorrect code for this rule with the default { "code": 80 } option:

Code Block
/*eslint max-len: ["error", { "code": 80 }]*/

var foo = { "bar": "This is a bar.", "baz": { "qux": "This is a qux" }, "difficult": "to read" };

Examples of correct code for this rule with the default { "code": 80 } option:

Code Block
/*eslint max-len: ["error", { "code": 80 }]*/

var foo = {
  "bar": "This is a bar.",
  "baz": { "qux": "This is a qux" },
  "easier": "to read"
};

react/sort-comp

Examples of incorrect code for this rule with   ["error", {  order: [ 'static-methods', 'lifecycle', 'render', 'everything-else' ], groups: <groups> }] option:

Code Block
/*eslint "react/sort-comp": [<enabled>, { order: [ 'static-methods', 'lifecycle', 'render', 'everything-else' ] }]*/

var Hello = createReactClass({
  onClick: function() {},
	render: function() {
    return <div>Hello</div>;
  },
});

Examples of correct code for this rule with   ["error", {  order: [ 'static-methods', 'lifecycle', 'render', 'everything-else' ], groups: <groups> }] option:

Code Block
/*eslint "react/sort-comp": [<enabled>, { order: [ 'static-methods', 'lifecycle', 'render', 'everything-else' ] }]*/

var Hello = createReactClass({
  render: function() {
    return <div>Hello</div>;
  },
  onClick: function() {}
});

react/jsx-one-expression-per-line

Examples of incorrect code for this rule with  ["error", { "allow": "literal" }] option:

Code Block
/* "react/jsx-one-expression-per-line": ["error", { "allow": "literal" }] */
<App><Hello /></App>

<App><Hello />
</App>

<App>
  <Hello>
  </Hello></App>

<App>
  <Hello /> World
</App>

Examples of correct code for this rule with the default { "beforeColon": false } option:

...

Example of component

Code style rules not covered by eslint

Suggestions for ESlint Rules

ESlint Rules (json)