Showing 51 of 51 total issues
Avoid too many return
statements within this function. Open
return false;
Function buildCSS
has a Cognitive Complexity of 6 (exceeds 5 allowed). Consider refactoring. Open
export default function buildCSS(stylesheets, options) {
let css = '';
foreach(stylesheets, (stylesheet, name) => {
const cssOptions = extend({}, options);
- Read upRead up
Cognitive Complexity
Cognitive Complexity is a measure of how difficult a unit of code is to intuitively understand. Unlike Cyclomatic Complexity, which determines how difficult your code will be to test, Cognitive Complexity tells you how difficult your code will be to read and comprehend.
A method's cognitive complexity is based on a few simple rules:
- Code is not considered more complex when it uses shorthand that the language provides for collapsing multiple statements into one
- Code is considered more complex for each "break in the linear flow of the code"
- Code is considered more complex when "flow breaking structures are nested"
Further reading
Missing trailing comma. Open
'return value of cssInJS(...) must be assigned to a variable'
- Read upRead up
- Exclude checks
require or disallow trailing commas (comma-dangle)
Trailing commas in object literals are valid according to the ECMAScript 5 (and ECMAScript 3!) spec. However, IE8 (when not in IE8 document mode) and below will throw an error when it encounters trailing commas in JavaScript.
var foo = {
bar: "baz",
qux: "quux",
};
Trailing commas simplify adding and removing items to objects and arrays, since only the lines you are modifying must be touched. Another argument in favor of trailing commas is that it improves the clarity of diffs when an item is added or removed from an object or array:
Less clear:
var foo = {
- bar: "baz",
- qux: "quux"
+ bar: "baz"
};
More clear:
var foo = {
bar: "baz",
- qux: "quux",
};
Rule Details
This rule enforces consistent use of trailing commas in object and array literals.
Options
This rule has a string option or an object option:
{
"comma-dangle": ["error", "never"],
// or
"comma-dangle": ["error", {
"arrays": "never",
"objects": "never",
"imports": "never",
"exports": "never",
"functions": "ignore",
}]
}
-
"never"
(default) disallows trailing commas -
"always"
requires trailing commas -
"always-multiline"
requires 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}
-
"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}
Trailing commas in function declarations and function calls are valid syntax since ECMAScript 2017; however, the string option does not check these situations for backwards compatibility.
You can also use an object option to configure this rule for each type of syntax.
Each of the following options can be set to "never"
, "always"
, "always-multiline"
, "only-multiline"
, or "ignore"
.
The default for each option is "never"
unless otherwise specified.
-
arrays
is for array literals and array patterns of destructuring. (e.g.let [a,] = [1,];
) -
objects
is for object literals and object patterns of destructuring. (e.g.let {a,} = {a: 1};
) -
imports
is for import declarations of ES Modules. (e.g.import {a,} from "foo";
) -
exports
is for export declarations of ES Modules. (e.g.export {a,};
) -
functions
is for function declarations and function calls. (e.g.(function(a,){ })(b,);
)
functions
is set to"ignore"
by default for consistency with the string option.
never
Examples of incorrect code for this rule with the default "never"
option:
/*eslint comma-dangle: ["error", "never"]*/
var foo = {
bar: "baz",
qux: "quux",
};
var arr = [1,2,];
foo({
bar: "baz",
qux: "quux",
});
Examples of correct code for this rule with the default "never"
option:
/*eslint comma-dangle: ["error", "never"]*/
var foo = {
bar: "baz",
qux: "quux"
};
var arr = [1,2];
foo({
bar: "baz",
qux: "quux"
});
always
Examples of incorrect code for this rule with the "always"
option:
/*eslint comma-dangle: ["error", "always"]*/
var foo = {
bar: "baz",
qux: "quux"
};
var arr = [1,2];
foo({
bar: "baz",
qux: "quux"
});
Examples of correct code for this rule with the "always"
option:
/*eslint comma-dangle: ["error", "always"]*/
var foo = {
bar: "baz",
qux: "quux",
};
var arr = [1,2,];
foo({
bar: "baz",
qux: "quux",
});
always-multiline
Examples of incorrect code for this rule with the "always-multiline"
option:
/*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:
/*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",
});
only-multiline
Examples of incorrect code for this rule with the "only-multiline"
option:
/*eslint comma-dangle: ["error", "only-multiline"]*/
var foo = { bar: "baz", qux: "quux", };
var arr = [1,2,];
var arr = [1,
2,];
Examples of correct code for this rule with the "only-multiline"
option:
/*eslint comma-dangle: ["error", "only-multiline"]*/
var foo = {
bar: "baz",
qux: "quux",
};
var foo = {
bar: "baz",
qux: "quux"
};
var foo = {bar: "baz", qux: "quux"};
var arr = [1,2];
var arr = [1,
2];
var arr = [
1,
2,
];
var arr = [
1,
2
];
foo({
bar: "baz",
qux: "quux",
});
foo({
bar: "baz",
qux: "quux"
});
functions
Examples of incorrect code for this rule with the {"functions": "never"}
option:
/*eslint comma-dangle: ["error", {"functions": "never"}]*/
function foo(a, b,) {
}
foo(a, b,);
new foo(a, b,);
Examples of correct code for this rule with the {"functions": "never"}
option:
/*eslint comma-dangle: ["error", {"functions": "never"}]*/
function foo(a, b) {
}
foo(a, b);
new foo(a, b);
Examples of incorrect code for this rule with the {"functions": "always"}
option:
/*eslint comma-dangle: ["error", {"functions": "always"}]*/
function foo(a, b) {
}
foo(a, b);
new foo(a, b);
Examples of correct code for this rule with the {"functions": "always"}
option:
/*eslint comma-dangle: ["error", {"functions": "always"}]*/
function foo(a, b,) {
}
foo(a, b,);
new foo(a, b,);
When Not To Use It
You can turn this rule off if you are not concerned with dangling commas. Source: http://eslint.org/docs/rules/
Unexpected require(). Open
contextFileCache[file] = require(file);
- Read upRead up
- Exclude checks
Enforce require() on the top-level module scope (global-require)
In Node.js, module dependencies are included using the require()
function, such as:
var fs = require("fs");
While require()
may be called anywhere in code, some style guides prescribe that it should be called only in the top level of a module to make it easier to identify dependencies. For instance, it's arguably harder to identify dependencies when they are deeply nested inside of functions and other statements:
function foo() {
if (condition) {
var fs = require("fs");
}
}
Since require()
does a synchronous load, it can cause performance problems when used in other locations.
Further, ES6 modules mandate that import
and export
statements can only occur in the top level of the module's body.
Rule Details
This rule requires all calls to require()
to be at the top level of the module, similar to ES6 import
and export
statements, which also can occur only at the top level.
Examples of incorrect code for this rule:
/*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);
}
Examples of correct code for this rule:
/*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");
When Not To Use It
If you have a module that must be initialized with information that comes from the file-system or if a module is only used in very rare situations and will cause significant overhead to load it may make sense to disable the rule. If you need to require()
an optional dependency inside of a try
/catch
, you can disable this rule for just that dependency using the // eslint-disable-line global-require
comment.
Source: http://eslint.org/docs/rules/
Unexpected mix of '||' and '&&'. Open
assert(t.isIdentifier(key) || t.isLiteral(key) && typeof key.value === 'string', 'key must be a string or identifier');
- Read upRead up
- Exclude checks
Disallow mixes of different operators (no-mixed-operators)
Enclosing complex expressions by parentheses clarifies the developer's intention, which makes the code more readable. This rule warns when different operators are used consecutively without parentheses in an expression.
var foo = a && b || c || d; /*BAD: Unexpected mix of '&&' and '||'.*/
var foo = (a && b) || c || d; /*GOOD*/
var foo = a && (b || c || d); /*GOOD*/
Rule Details
This rule checks BinaryExpression
and LogicalExpression
.
This rule may conflict with [no-extra-parens](no-extra-parens.md) rule.
If you use both this and [no-extra-parens](no-extra-parens.md) rule together, you need to use the nestedBinaryExpressions
option of [no-extra-parens](no-extra-parens.md) rule.
Examples of incorrect code for this rule:
/*eslint no-mixed-operators: "error"*/
var foo = a && b < 0 || c > 0 || d + 1 === 0;
var foo = a + b * c;
Examples of correct code for this rule:
/*eslint no-mixed-operators: "error"*/
var foo = a || b || c;
var foo = a && b && c;
var foo = (a && b < 0) || c > 0 || d + 1 === 0;
var foo = a && (b < 0 || c > 0 || d + 1 === 0);
var foo = a + (b * c);
var foo = (a + b) * c;
Options
{
"no-mixed-operators": [
"error",
{
"groups": [
["+", "-", "*", "/", "%", "**"],
["&", "|", "^", "~", "<<", ">>", ">>>"],
["==", "!=", "===", "!==", ">", ">=", "<", "<="],
["&&", "||"],
["in", "instanceof"]
],
"allowSamePrecedence": true
}
]
}
This rule has 2 options.
-
groups
(string[][]
) - specifies groups to compare operators. When this rule compares two operators, if both operators are included in a same group, this rule checks it. Otherwise, this rule ignores it. This value is a list of groups. The group is a list of binary operators. Default is the groups for each kind of operators. -
allowSamePrecedence
(boolean
) - specifies to allow mix of 2 operators if those have the same precedence. Default istrue
.
groups
The following operators can be used in groups
option:
- Arithmetic Operators:
"+"
,"-"
,"*"
,"/"
,"%"
,"**"
- Bitwise Operators:
"&"
,"|"
,"^"
,"~"
,"<<"
,">>"
,">>>"
- Comparison Operators:
"=="
,"!="
,"==="
,"!=="
,">"
,">="
,"<"
,"<="
- Logical Operators:
"&&"
,"||"
- Relational Operators:
"in"
,"instanceof"
Now, considers about {"groups": [["&", "|", "^", "~", "<<", ">>", ">>>"], ["&&", "||"]]}
configure.
This configure has 2 groups: bitwise operators and logical operators.
This rule checks only if both operators are included in a same group.
So, in this case, this rule comes to check between bitwise operators and between logical operators.
This rule ignores other operators.
Examples of incorrect code for this rule with {"groups": [["&", "|", "^", "~", "<<", ">>", ">>>"], ["&&", "||"]]}
option:
/*eslint no-mixed-operators: ["error", {"groups": [["&", "|", "^", "~", "<<", ">>", ">>>"], ["&&", "||"]]}]*/
var foo = a && b < 0 || c > 0 || d + 1 === 0;
var foo = a & b | c;
Examples of correct code for this rule with {"groups": [["&", "|", "^", "~", "<<", ">>", ">>>"], ["&&", "||"]]}
option:
/*eslint no-mixed-operators: ["error", {"groups": [["&", "|", "^", "~", "<<", ">>", ">>>"], ["&&", "||"]]}]*/
var foo = a || b > 0 || c + 1 === 0;
var foo = a && b > 0 && c + 1 === 0;
var foo = (a && b < 0) || c > 0 || d + 1 === 0;
var foo = a && (b < 0 || c > 0 || d + 1 === 0);
var foo = (a & b) | c;
var foo = a & (b | c);
var foo = a + b * c;
var foo = a + (b * c);
var foo = (a + b) * c;
allowSamePrecedence
Examples of correct code for this rule with {"allowSamePrecedence": true}
option:
/*eslint no-mixed-operators: ["error", {"allowSamePrecedence": true}]*/
// + and - have the same precedence.
var foo = a + b - c;
Examples of incorrect code for this rule with {"allowSamePrecedence": false}
option:
/*eslint no-mixed-operators: ["error", {"allowSamePrecedence": false}]*/
// + and - have the same precedence.
var foo = a + b - c;
When Not To Use It
If you don't want to be notified about mixed operators, then it's safe to disable this rule.
Related Rules
- [no-extra-parens](no-extra-parens.md) Source: http://eslint.org/docs/rules/
Unary operator '++' used. Open
for (let i = 0; i < level; i++) {
- Read upRead up
- Exclude checks
disallow the unary operators ++
and --
(no-plusplus)
Because the unary ++
and --
operators are subject to automatic semicolon insertion, differences in whitespace can change semantics of source code.
var i = 10;
var j = 20;
i ++
j
// i = 11, j = 20
var i = 10;
var j = 20;
i
++
j
// i = 10, j = 21
Rule Details
This rule disallows the unary operators ++
and --
.
Examples of incorrect code for this rule:
/*eslint no-plusplus: "error"*/
var foo = 0;
foo++;
var bar = 42;
bar--;
for (i = 0; i < l; i++) {
return;
}
Examples of correct code for this rule:
/*eslint no-plusplus: "error"*/
var foo = 0;
foo += 1;
var bar = 42;
bar -= 1;
for (i = 0; i < l; i += 1) {
return;
}
Options
This rule has an object option.
-
"allowForLoopAfterthoughts": true
allows unary operators++
and--
in the afterthought (final expression) of afor
loop.
allowForLoopAfterthoughts
Examples of correct code for this rule with the { "allowForLoopAfterthoughts": true }
option:
/*eslint no-plusplus: ["error", { "allowForLoopAfterthoughts": true }]*/
for (i = 0; i < l; i++) {
return;
}
for (i = 0; i < l; i--) {
return;
}
Source: http://eslint.org/docs/rules/
Do not access Object.prototype method 'hasOwnProperty' from target object. Open
} else if (t.isIdentifier(expr) && context.hasOwnProperty(expr.name)) {
- Read upRead up
- Exclude checks
Disallow use of Object.prototypes builtins directly (no-prototype-builtins)
In ECMAScript 5.1, Object.create
was added, which enables the creation of objects with a specified [[Prototype]]
. Object.create(null)
is a common pattern used to create objects that will be used as a Map. This can lead to errors when it is assumed that objects will have properties from Object.prototype
. This rule prevents calling Object.prototype
methods directly from an object.
Rule Details
This rule disallows calling some Object.prototype
methods directly on object instances.
Examples of incorrect code for this rule:
/*eslint no-prototype-builtins: "error"*/
var hasBarProperty = foo.hasOwnProperty("bar");
var isPrototypeOfBar = foo.isPrototypeOf(bar);
var barIsEnumerable = foo.propertyIsEnumerable("bar");
Examples of correct code for this rule:
/*eslint no-prototype-builtins: "error"*/
var hasBarProperty = Object.prototype.hasOwnProperty.call(foo, "bar");
var isPrototypeOfBar = Object.prototype.isPrototypeOf.call(foo, bar);
var barIsEnumerable = {}.propertyIsEnumerable.call(foo, "bar");
When Not To Use It
You may want to turn this rule off if you will never use an object that shadows an Object.prototype
method or which does not inherit from Object.prototype
.
Source: http://eslint.org/docs/rules/
Unexpected string concatenation. Open
css.push(indent(level) + '}');
- Read upRead up
- Exclude checks
Suggest using template literals instead of string concatenation. (prefer-template)
In ES2015 (ES6), we can use template literals instead of string concatenation.
var str = "Hello, " + name + "!";
/*eslint-env es6*/
var str = `Hello, ${name}!`;
Rule Details
This rule is aimed to flag usage of +
operators with strings.
Examples
Examples of incorrect code for this rule:
/*eslint prefer-template: "error"*/
var str = "Hello, " + name + "!";
var str = "Time: " + (12 * 60 * 60 * 1000);
Examples of correct code for this rule:
/*eslint prefer-template: "error"*/
/*eslint-env es6*/
var str = "Hello World!";
var str = `Hello, ${name}!`;
var str = `Time: ${12 * 60 * 60 * 1000}`;
// This is reported by `no-useless-concat`.
var str = "Hello, " + "World!";
When Not To Use It
This rule should not be used in ES3/5 environments.
In ES2015 (ES6) or later, if you don't want to be notified about string concatenation, you can safely disable this rule.
Related Rules
- [no-useless-concat](no-useless-concat.md)
- [quotes](quotes.md) Source: http://eslint.org/docs/rules/
Unexpected string concatenation. Open
value = "'" + value.replace(/'/g, "\\'") + "'";
- Read upRead up
- Exclude checks
Suggest using template literals instead of string concatenation. (prefer-template)
In ES2015 (ES6), we can use template literals instead of string concatenation.
var str = "Hello, " + name + "!";
/*eslint-env es6*/
var str = `Hello, ${name}!`;
Rule Details
This rule is aimed to flag usage of +
operators with strings.
Examples
Examples of incorrect code for this rule:
/*eslint prefer-template: "error"*/
var str = "Hello, " + name + "!";
var str = "Time: " + (12 * 60 * 60 * 1000);
Examples of correct code for this rule:
/*eslint prefer-template: "error"*/
/*eslint-env es6*/
var str = "Hello World!";
var str = `Hello, ${name}!`;
var str = `Time: ${12 * 60 * 60 * 1000}`;
// This is reported by `no-useless-concat`.
var str = "Hello, " + "World!";
When Not To Use It
This rule should not be used in ES3/5 environments.
In ES2015 (ES6) or later, if you don't want to be notified about string concatenation, you can safely disable this rule.
Related Rules
- [no-useless-concat](no-useless-concat.md)
- [quotes](quotes.md) Source: http://eslint.org/docs/rules/
Unexpected block statement surrounding arrow body. Open
return cache.fetch(className, (keys) => {
- Read upRead up
- Exclude checks
Require braces in arrow function body (arrow-body-style)
Arrow functions have two syntactic forms for their function bodies. They may be defined with a block body (denoted by curly braces) () => { ... }
or with a single expression () => ...
, whose value is implicitly returned.
Rule Details
This rule can enforce or disallow the use of braces around arrow function body.
Options
The rule takes one or two options. The first is a string, which can be:
-
"always"
enforces braces around the function body -
"as-needed"
enforces no braces where they can be omitted (default) -
"never"
enforces no braces around the function body (constrains arrow functions to the role of returning an expression)
The second one is an object for more fine-grained configuration when the first option is "as-needed"
. Currently, the only available option is requireReturnForObjectLiteral
, a boolean property. It's false
by default. If set to true
, it requires braces and an explicit return for object literals.
"arrow-body-style": ["error", "always"]
always
Examples of incorrect code for this rule with the "always"
option:
/*eslint arrow-body-style: ["error", "always"]*/
/*eslint-env es6*/
let foo = () => 0;
Examples of correct code for this rule with the "always"
option:
let foo = () => {
return 0;
};
let foo = (retv, name) => {
retv[name] = true;
return retv;
};
as-needed
Examples of incorrect code for this rule with the default "as-needed"
option:
/*eslint arrow-body-style: ["error", "as-needed"]*/
/*eslint-env es6*/
let foo = () => {
return 0;
};
let foo = () => {
return {
bar: {
foo: 1,
bar: 2,
}
};
};
Examples of correct code for this rule with the default "as-needed"
option:
/*eslint arrow-body-style: ["error", "as-needed"]*/
/*eslint-env es6*/
let foo = () => 0;
let foo = (retv, name) => {
retv[name] = true;
return retv;
};
let foo = () => ({
bar: {
foo: 1,
bar: 2,
}
});
let foo = () => { bar(); };
let foo = () => {};
let foo = () => { /* do nothing */ };
let foo = () => {
// do nothing.
};
let foo = () => ({ bar: 0 });
requireReturnForObjectLiteral
This option is only applicable when used in conjunction with the
"as-needed"
option.
Examples of incorrect code for this rule with the { "requireReturnForObjectLiteral": true }
option:
/*eslint arrow-body-style: ["error", "as-needed", { "requireReturnForObjectLiteral": true }]*/
/*eslint-env es6*/
let foo = () => ({});
let foo = () => ({ bar: 0 });
Examples of correct code for this rule with the { "requireReturnForObjectLiteral": true }
option:
/*eslint arrow-body-style: ["error", "as-needed", { "requireReturnForObjectLiteral": true }]*/
/*eslint-env es6*/
let foo = () => {};
let foo = () => { return { bar: 0 }; };
never
Examples of incorrect code for this rule with the "never"
option:
/*eslint arrow-body-style: ["error", "never"]*/
/*eslint-env es6*/
let foo = () => {
return 0;
};
let foo = (retv, name) => {
retv[name] = true;
return retv;
};
Examples of correct code for this rule with the "never"
option:
/*eslint arrow-body-style: ["error", "never"]*/
/*eslint-env es6*/
let foo = () => 0;
let foo = () => ({ foo: 0 });
Source: http://eslint.org/docs/rules/
Missing trailing comma. Open
t.stringLiteral(generateClassName(styleId, gcnOptions))
- Read upRead up
- Exclude checks
require or disallow trailing commas (comma-dangle)
Trailing commas in object literals are valid according to the ECMAScript 5 (and ECMAScript 3!) spec. However, IE8 (when not in IE8 document mode) and below will throw an error when it encounters trailing commas in JavaScript.
var foo = {
bar: "baz",
qux: "quux",
};
Trailing commas simplify adding and removing items to objects and arrays, since only the lines you are modifying must be touched. Another argument in favor of trailing commas is that it improves the clarity of diffs when an item is added or removed from an object or array:
Less clear:
var foo = {
- bar: "baz",
- qux: "quux"
+ bar: "baz"
};
More clear:
var foo = {
bar: "baz",
- qux: "quux",
};
Rule Details
This rule enforces consistent use of trailing commas in object and array literals.
Options
This rule has a string option or an object option:
{
"comma-dangle": ["error", "never"],
// or
"comma-dangle": ["error", {
"arrays": "never",
"objects": "never",
"imports": "never",
"exports": "never",
"functions": "ignore",
}]
}
-
"never"
(default) disallows trailing commas -
"always"
requires trailing commas -
"always-multiline"
requires 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}
-
"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}
Trailing commas in function declarations and function calls are valid syntax since ECMAScript 2017; however, the string option does not check these situations for backwards compatibility.
You can also use an object option to configure this rule for each type of syntax.
Each of the following options can be set to "never"
, "always"
, "always-multiline"
, "only-multiline"
, or "ignore"
.
The default for each option is "never"
unless otherwise specified.
-
arrays
is for array literals and array patterns of destructuring. (e.g.let [a,] = [1,];
) -
objects
is for object literals and object patterns of destructuring. (e.g.let {a,} = {a: 1};
) -
imports
is for import declarations of ES Modules. (e.g.import {a,} from "foo";
) -
exports
is for export declarations of ES Modules. (e.g.export {a,};
) -
functions
is for function declarations and function calls. (e.g.(function(a,){ })(b,);
)
functions
is set to"ignore"
by default for consistency with the string option.
never
Examples of incorrect code for this rule with the default "never"
option:
/*eslint comma-dangle: ["error", "never"]*/
var foo = {
bar: "baz",
qux: "quux",
};
var arr = [1,2,];
foo({
bar: "baz",
qux: "quux",
});
Examples of correct code for this rule with the default "never"
option:
/*eslint comma-dangle: ["error", "never"]*/
var foo = {
bar: "baz",
qux: "quux"
};
var arr = [1,2];
foo({
bar: "baz",
qux: "quux"
});
always
Examples of incorrect code for this rule with the "always"
option:
/*eslint comma-dangle: ["error", "always"]*/
var foo = {
bar: "baz",
qux: "quux"
};
var arr = [1,2];
foo({
bar: "baz",
qux: "quux"
});
Examples of correct code for this rule with the "always"
option:
/*eslint comma-dangle: ["error", "always"]*/
var foo = {
bar: "baz",
qux: "quux",
};
var arr = [1,2,];
foo({
bar: "baz",
qux: "quux",
});
always-multiline
Examples of incorrect code for this rule with the "always-multiline"
option:
/*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:
/*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",
});
only-multiline
Examples of incorrect code for this rule with the "only-multiline"
option:
/*eslint comma-dangle: ["error", "only-multiline"]*/
var foo = { bar: "baz", qux: "quux", };
var arr = [1,2,];
var arr = [1,
2,];
Examples of correct code for this rule with the "only-multiline"
option:
/*eslint comma-dangle: ["error", "only-multiline"]*/
var foo = {
bar: "baz",
qux: "quux",
};
var foo = {
bar: "baz",
qux: "quux"
};
var foo = {bar: "baz", qux: "quux"};
var arr = [1,2];
var arr = [1,
2];
var arr = [
1,
2,
];
var arr = [
1,
2
];
foo({
bar: "baz",
qux: "quux",
});
foo({
bar: "baz",
qux: "quux"
});
functions
Examples of incorrect code for this rule with the {"functions": "never"}
option:
/*eslint comma-dangle: ["error", {"functions": "never"}]*/
function foo(a, b,) {
}
foo(a, b,);
new foo(a, b,);
Examples of correct code for this rule with the {"functions": "never"}
option:
/*eslint comma-dangle: ["error", {"functions": "never"}]*/
function foo(a, b) {
}
foo(a, b);
new foo(a, b);
Examples of incorrect code for this rule with the {"functions": "always"}
option:
/*eslint comma-dangle: ["error", {"functions": "always"}]*/
function foo(a, b) {
}
foo(a, b);
new foo(a, b);
Examples of correct code for this rule with the {"functions": "always"}
option:
/*eslint comma-dangle: ["error", {"functions": "always"}]*/
function foo(a, b,) {
}
foo(a, b,);
new foo(a, b,);
When Not To Use It
You can turn this rule off if you are not concerned with dangling commas. Source: http://eslint.org/docs/rules/
Unexpected mix of '||' and '&&'. Open
assert(t.isIdentifier(key) || t.isLiteral(key) && typeof key.value === 'string', 'key must be a string or identifier');
- Read upRead up
- Exclude checks
Disallow mixes of different operators (no-mixed-operators)
Enclosing complex expressions by parentheses clarifies the developer's intention, which makes the code more readable. This rule warns when different operators are used consecutively without parentheses in an expression.
var foo = a && b || c || d; /*BAD: Unexpected mix of '&&' and '||'.*/
var foo = (a && b) || c || d; /*GOOD*/
var foo = a && (b || c || d); /*GOOD*/
Rule Details
This rule checks BinaryExpression
and LogicalExpression
.
This rule may conflict with [no-extra-parens](no-extra-parens.md) rule.
If you use both this and [no-extra-parens](no-extra-parens.md) rule together, you need to use the nestedBinaryExpressions
option of [no-extra-parens](no-extra-parens.md) rule.
Examples of incorrect code for this rule:
/*eslint no-mixed-operators: "error"*/
var foo = a && b < 0 || c > 0 || d + 1 === 0;
var foo = a + b * c;
Examples of correct code for this rule:
/*eslint no-mixed-operators: "error"*/
var foo = a || b || c;
var foo = a && b && c;
var foo = (a && b < 0) || c > 0 || d + 1 === 0;
var foo = a && (b < 0 || c > 0 || d + 1 === 0);
var foo = a + (b * c);
var foo = (a + b) * c;
Options
{
"no-mixed-operators": [
"error",
{
"groups": [
["+", "-", "*", "/", "%", "**"],
["&", "|", "^", "~", "<<", ">>", ">>>"],
["==", "!=", "===", "!==", ">", ">=", "<", "<="],
["&&", "||"],
["in", "instanceof"]
],
"allowSamePrecedence": true
}
]
}
This rule has 2 options.
-
groups
(string[][]
) - specifies groups to compare operators. When this rule compares two operators, if both operators are included in a same group, this rule checks it. Otherwise, this rule ignores it. This value is a list of groups. The group is a list of binary operators. Default is the groups for each kind of operators. -
allowSamePrecedence
(boolean
) - specifies to allow mix of 2 operators if those have the same precedence. Default istrue
.
groups
The following operators can be used in groups
option:
- Arithmetic Operators:
"+"
,"-"
,"*"
,"/"
,"%"
,"**"
- Bitwise Operators:
"&"
,"|"
,"^"
,"~"
,"<<"
,">>"
,">>>"
- Comparison Operators:
"=="
,"!="
,"==="
,"!=="
,">"
,">="
,"<"
,"<="
- Logical Operators:
"&&"
,"||"
- Relational Operators:
"in"
,"instanceof"
Now, considers about {"groups": [["&", "|", "^", "~", "<<", ">>", ">>>"], ["&&", "||"]]}
configure.
This configure has 2 groups: bitwise operators and logical operators.
This rule checks only if both operators are included in a same group.
So, in this case, this rule comes to check between bitwise operators and between logical operators.
This rule ignores other operators.
Examples of incorrect code for this rule with {"groups": [["&", "|", "^", "~", "<<", ">>", ">>>"], ["&&", "||"]]}
option:
/*eslint no-mixed-operators: ["error", {"groups": [["&", "|", "^", "~", "<<", ">>", ">>>"], ["&&", "||"]]}]*/
var foo = a && b < 0 || c > 0 || d + 1 === 0;
var foo = a & b | c;
Examples of correct code for this rule with {"groups": [["&", "|", "^", "~", "<<", ">>", ">>>"], ["&&", "||"]]}
option:
/*eslint no-mixed-operators: ["error", {"groups": [["&", "|", "^", "~", "<<", ">>", ">>>"], ["&&", "||"]]}]*/
var foo = a || b > 0 || c + 1 === 0;
var foo = a && b > 0 && c + 1 === 0;
var foo = (a && b < 0) || c > 0 || d + 1 === 0;
var foo = a && (b < 0 || c > 0 || d + 1 === 0);
var foo = (a & b) | c;
var foo = a & (b | c);
var foo = a + b * c;
var foo = a + (b * c);
var foo = (a + b) * c;
allowSamePrecedence
Examples of correct code for this rule with {"allowSamePrecedence": true}
option:
/*eslint no-mixed-operators: ["error", {"allowSamePrecedence": true}]*/
// + and - have the same precedence.
var foo = a + b - c;
Examples of incorrect code for this rule with {"allowSamePrecedence": false}
option:
/*eslint no-mixed-operators: ["error", {"allowSamePrecedence": false}]*/
// + and - have the same precedence.
var foo = a + b - c;
When Not To Use It
If you don't want to be notified about mixed operators, then it's safe to disable this rule.
Related Rules
- [no-extra-parens](no-extra-parens.md) Source: http://eslint.org/docs/rules/
Unexpected string concatenation. Open
css.push(indent(level) + '@' + generateMediaQueryName(query, options) + ' {');
- Read upRead up
- Exclude checks
Suggest using template literals instead of string concatenation. (prefer-template)
In ES2015 (ES6), we can use template literals instead of string concatenation.
var str = "Hello, " + name + "!";
/*eslint-env es6*/
var str = `Hello, ${name}!`;
Rule Details
This rule is aimed to flag usage of +
operators with strings.
Examples
Examples of incorrect code for this rule:
/*eslint prefer-template: "error"*/
var str = "Hello, " + name + "!";
var str = "Time: " + (12 * 60 * 60 * 1000);
Examples of correct code for this rule:
/*eslint prefer-template: "error"*/
/*eslint-env es6*/
var str = "Hello World!";
var str = `Hello, ${name}!`;
var str = `Time: ${12 * 60 * 60 * 1000}`;
// This is reported by `no-useless-concat`.
var str = "Hello, " + "World!";
When Not To Use It
This rule should not be used in ES3/5 environments.
In ES2015 (ES6) or later, if you don't want to be notified about string concatenation, you can safely disable this rule.
Related Rules
- [no-useless-concat](no-useless-concat.md)
- [quotes](quotes.md) Source: http://eslint.org/docs/rules/
Calls to require() should use string literals Open
contextFileCache[file] = require(file);
- Read upRead up
- Exclude checks
For more information visit Source: http://eslint.org/docs/rules/
Unexpected string concatenation. Open
css.push(indent(level) + '}');
- Read upRead up
- Exclude checks
Suggest using template literals instead of string concatenation. (prefer-template)
In ES2015 (ES6), we can use template literals instead of string concatenation.
var str = "Hello, " + name + "!";
/*eslint-env es6*/
var str = `Hello, ${name}!`;
Rule Details
This rule is aimed to flag usage of +
operators with strings.
Examples
Examples of incorrect code for this rule:
/*eslint prefer-template: "error"*/
var str = "Hello, " + name + "!";
var str = "Time: " + (12 * 60 * 60 * 1000);
Examples of correct code for this rule:
/*eslint prefer-template: "error"*/
/*eslint-env es6*/
var str = "Hello World!";
var str = `Hello, ${name}!`;
var str = `Time: ${12 * 60 * 60 * 1000}`;
// This is reported by `no-useless-concat`.
var str = "Hello, " + "World!";
When Not To Use It
This rule should not be used in ES3/5 environments.
In ES2015 (ES6) or later, if you don't want to be notified about string concatenation, you can safely disable this rule.
Related Rules
- [no-useless-concat](no-useless-concat.md)
- [quotes](quotes.md) Source: http://eslint.org/docs/rules/
Unnecessary escape character: [. Open
const hasAttachedSelector = /[^:\[]+[:\[]/;
- Read upRead up
- Exclude checks
Disallow unnecessary escape usage (no-useless-escape)
Escaping non-special characters in strings, template literals, and regular expressions doesn't have any effect, as demonstrated in the following example:
let foo = "hol\a"; // > foo = "hola"
let bar = `${foo}\!`; // > bar = "hola!"
let baz = /\:/ // same functionality with /:/
Rule Details
This rule flags escapes that can be safely removed without changing behavior.
Examples of incorrect code for this rule:
/*eslint no-useless-escape: "error"*/
"\'";
'\"';
"\#";
"\e";
`\"`;
`\"${foo}\"`;
`\#{foo}`;
/\!/;
/\@/;
Examples of correct code for this rule:
/*eslint no-useless-escape: "error"*/
"\"";
'\'';
"\x12";
"\u00a9";
"\371";
"xs\u2111";
`\``;
`\${${foo}\}`;
`$\{${foo}\}`;
/\\/g;
/\t/g;
/\w\$\*\^\./;
When Not To Use It
If you don't want to be notified about unnecessary escapes, you can safely disable this rule. Source: http://eslint.org/docs/rules/
Unexpected string concatenation. Open
return '_' + keys.length.toString(36).split('').reverse().join('');
- Read upRead up
- Exclude checks
Suggest using template literals instead of string concatenation. (prefer-template)
In ES2015 (ES6), we can use template literals instead of string concatenation.
var str = "Hello, " + name + "!";
/*eslint-env es6*/
var str = `Hello, ${name}!`;
Rule Details
This rule is aimed to flag usage of +
operators with strings.
Examples
Examples of incorrect code for this rule:
/*eslint prefer-template: "error"*/
var str = "Hello, " + name + "!";
var str = "Time: " + (12 * 60 * 60 * 1000);
Examples of correct code for this rule:
/*eslint prefer-template: "error"*/
/*eslint-env es6*/
var str = "Hello World!";
var str = `Hello, ${name}!`;
var str = `Time: ${12 * 60 * 60 * 1000}`;
// This is reported by `no-useless-concat`.
var str = "Hello, " + "World!";
When Not To Use It
This rule should not be used in ES3/5 environments.
In ES2015 (ES6) or later, if you don't want to be notified about string concatenation, you can safely disable this rule.
Related Rules
- [no-useless-concat](no-useless-concat.md)
- [quotes](quotes.md) Source: http://eslint.org/docs/rules/
Unexpected string concatenation. Open
result += options.prefixes.map(p => p.replace(invalidChars, '_')).join('-') + '-';
- Read upRead up
- Exclude checks
Suggest using template literals instead of string concatenation. (prefer-template)
In ES2015 (ES6), we can use template literals instead of string concatenation.
var str = "Hello, " + name + "!";
/*eslint-env es6*/
var str = `Hello, ${name}!`;
Rule Details
This rule is aimed to flag usage of +
operators with strings.
Examples
Examples of incorrect code for this rule:
/*eslint prefer-template: "error"*/
var str = "Hello, " + name + "!";
var str = "Time: " + (12 * 60 * 60 * 1000);
Examples of correct code for this rule:
/*eslint prefer-template: "error"*/
/*eslint-env es6*/
var str = "Hello World!";
var str = `Hello, ${name}!`;
var str = `Time: ${12 * 60 * 60 * 1000}`;
// This is reported by `no-useless-concat`.
var str = "Hello, " + "World!";
When Not To Use It
This rule should not be used in ES3/5 environments.
In ES2015 (ES6) or later, if you don't want to be notified about string concatenation, you can safely disable this rule.
Related Rules
- [no-useless-concat](no-useless-concat.md)
- [quotes](quotes.md) Source: http://eslint.org/docs/rules/
Unexpected string concatenation. Open
assert(false, err + '\nWhen providing a function to cssInJS, all references must be in the function\'s scope.');
- Read upRead up
- Exclude checks
Suggest using template literals instead of string concatenation. (prefer-template)
In ES2015 (ES6), we can use template literals instead of string concatenation.
var str = "Hello, " + name + "!";
/*eslint-env es6*/
var str = `Hello, ${name}!`;
Rule Details
This rule is aimed to flag usage of +
operators with strings.
Examples
Examples of incorrect code for this rule:
/*eslint prefer-template: "error"*/
var str = "Hello, " + name + "!";
var str = "Time: " + (12 * 60 * 60 * 1000);
Examples of correct code for this rule:
/*eslint prefer-template: "error"*/
/*eslint-env es6*/
var str = "Hello World!";
var str = `Hello, ${name}!`;
var str = `Time: ${12 * 60 * 60 * 1000}`;
// This is reported by `no-useless-concat`.
var str = "Hello, " + "World!";
When Not To Use It
This rule should not be used in ES3/5 environments.
In ES2015 (ES6) or later, if you don't want to be notified about string concatenation, you can safely disable this rule.
Related Rules
- [no-useless-concat](no-useless-concat.md)
- [quotes](quotes.md) Source: http://eslint.org/docs/rules/
Unexpected string concatenation. Open
value = '' + value + 'px';
- Read upRead up
- Exclude checks
Suggest using template literals instead of string concatenation. (prefer-template)
In ES2015 (ES6), we can use template literals instead of string concatenation.
var str = "Hello, " + name + "!";
/*eslint-env es6*/
var str = `Hello, ${name}!`;
Rule Details
This rule is aimed to flag usage of +
operators with strings.
Examples
Examples of incorrect code for this rule:
/*eslint prefer-template: "error"*/
var str = "Hello, " + name + "!";
var str = "Time: " + (12 * 60 * 60 * 1000);
Examples of correct code for this rule:
/*eslint prefer-template: "error"*/
/*eslint-env es6*/
var str = "Hello World!";
var str = `Hello, ${name}!`;
var str = `Time: ${12 * 60 * 60 * 1000}`;
// This is reported by `no-useless-concat`.
var str = "Hello, " + "World!";
When Not To Use It
This rule should not be used in ES3/5 environments.
In ES2015 (ES6) or later, if you don't want to be notified about string concatenation, you can safely disable this rule.
Related Rules
- [no-useless-concat](no-useless-concat.md)
- [quotes](quotes.md) Source: http://eslint.org/docs/rules/