unicef/magicbox-maps

View on GitHub

Showing 48 of 48 total issues

Function render has 29 lines of code (exceeds 25 allowed). Consider refactoring.
Open

  render() {
    const columns = [{
      type: 'date',
      id: 'Date'
    }, {
Severity: Minor
Found in react-app/src/components/YearlyCalendar.js - About 1 hr to fix

Function adminStyle has 26 lines of code (exceeds 25 allowed). Consider refactoring.
Open

export function adminStyle(props) {
  return function(geoJsonFeature) {
    let admin_id = geoJsonFeature.properties.admin_id
    let admin_index = props.activeCountry.admin_index
    let active_country = props.activeCountry
Severity: Minor
Found in react-app/src/helpers/helper-admins-style.js - About 1 hr to fix

Identical blocks of code found in 2 locations. Consider refactoring.
Open

      if (err || !resp.ok) {
        console.log(token);
        console.log('Error with new token');
      } else {
        console.log('yay got ' + JSON.parse(resp.text));
Severity: Minor
Found in routes/helper-router.js and 1 other location - About 55 mins to fix
routes/helper-router.js on lines 77..86

Duplicated Code

Duplicated code can lead to software that is hard to understand and difficult to change. The Don't Repeat Yourself (DRY) principle states:

Every piece of knowledge must have a single, unambiguous, authoritative representation within a system.

When you violate DRY, bugs and maintenance problems are sure to follow. Duplicated code has a tendency to both continue to replicate and also to diverge (leaving bugs as two similar implementations differ in subtle ways).

Tuning

This issue has a mass of 54.

We set useful threshold defaults for the languages we support but you may want to adjust these settings based on your project guidelines.

The threshold configuration represents the minimum mass a code block must have to be analyzed for duplication. The lower the threshold, the more fine-grained the comparison.

If the engine is too easily reporting duplication, try raising the threshold. If you suspect that the engine isn't catching enough duplication, try lowering the threshold. The best setting tends to differ from language to language.

See codeclimate-duplication's documentation for more information about tuning the mass threshold in your .codeclimate.yml.

Refactorings

Further Reading

Identical blocks of code found in 2 locations. Consider refactoring.
Open

      if (err || !resp.ok) {
        console.log('Oh no! error. Getting new Token');
        getNewToken(rfUrl, refreshToken)
          .then(() => {
            getResponseError(url, acToken, res);
Severity: Minor
Found in routes/helper-router.js and 1 other location - About 55 mins to fix
routes/helper-router.js on lines 50..56

Duplicated Code

Duplicated code can lead to software that is hard to understand and difficult to change. The Don't Repeat Yourself (DRY) principle states:

Every piece of knowledge must have a single, unambiguous, authoritative representation within a system.

When you violate DRY, bugs and maintenance problems are sure to follow. Duplicated code has a tendency to both continue to replicate and also to diverge (leaving bugs as two similar implementations differ in subtle ways).

Tuning

This issue has a mass of 54.

We set useful threshold defaults for the languages we support but you may want to adjust these settings based on your project guidelines.

The threshold configuration represents the minimum mass a code block must have to be analyzed for duplication. The lower the threshold, the more fine-grained the comparison.

If the engine is too easily reporting duplication, try raising the threshold. If you suspect that the engine isn't catching enough duplication, try lowering the threshold. The best setting tends to differ from language to language.

See codeclimate-duplication's documentation for more information about tuning the mass threshold in your .codeclimate.yml.

Refactorings

Further Reading

Function assign_speed_value has a Cognitive Complexity of 9 (exceeds 5 allowed). Consider refactoring.
Open

export function assign_speed_value(properties) {
  let slider = 3
  let value = null;
  if (properties.speed_connectivity !== null &&
    typeof properties.speed_connectivity !== 'undefined'
Severity: Minor
Found in react-app/src/helpers/helper-country-point.js - About 55 mins to fix

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

Similar blocks of code found in 2 locations. Consider refactoring.
Open

              isAuthenticated() && (
                <Button
                  id="qsLogoutBtn"
                  bsStyle="primary"
                  className="btn-margin"
Severity: Minor
Found in react-app/src/authorization/Shield.js and 1 other location - About 35 mins to fix
react-app/src/authorization/Shield.js on lines 53..62

Duplicated Code

Duplicated code can lead to software that is hard to understand and difficult to change. The Don't Repeat Yourself (DRY) principle states:

Every piece of knowledge must have a single, unambiguous, authoritative representation within a system.

When you violate DRY, bugs and maintenance problems are sure to follow. Duplicated code has a tendency to both continue to replicate and also to diverge (leaving bugs as two similar implementations differ in subtle ways).

Tuning

This issue has a mass of 47.

We set useful threshold defaults for the languages we support but you may want to adjust these settings based on your project guidelines.

The threshold configuration represents the minimum mass a code block must have to be analyzed for duplication. The lower the threshold, the more fine-grained the comparison.

If the engine is too easily reporting duplication, try raising the threshold. If you suspect that the engine isn't catching enough duplication, try lowering the threshold. The best setting tends to differ from language to language.

See codeclimate-duplication's documentation for more information about tuning the mass threshold in your .codeclimate.yml.

Refactorings

Further Reading

Similar blocks of code found in 2 locations. Consider refactoring.
Open

              !isAuthenticated() && (
                <Button
                  id="qsLoginBtn"
                  bsStyle="primary"
                  className="btn-margin"
Severity: Minor
Found in react-app/src/authorization/Shield.js and 1 other location - About 35 mins to fix
react-app/src/authorization/Shield.js on lines 65..74

Duplicated Code

Duplicated code can lead to software that is hard to understand and difficult to change. The Don't Repeat Yourself (DRY) principle states:

Every piece of knowledge must have a single, unambiguous, authoritative representation within a system.

When you violate DRY, bugs and maintenance problems are sure to follow. Duplicated code has a tendency to both continue to replicate and also to diverge (leaving bugs as two similar implementations differ in subtle ways).

Tuning

This issue has a mass of 47.

We set useful threshold defaults for the languages we support but you may want to adjust these settings based on your project guidelines.

The threshold configuration represents the minimum mass a code block must have to be analyzed for duplication. The lower the threshold, the more fine-grained the comparison.

If the engine is too easily reporting duplication, try raising the threshold. If you suspect that the engine isn't catching enough duplication, try lowering the threshold. The best setting tends to differ from language to language.

See codeclimate-duplication's documentation for more information about tuning the mass threshold in your .codeclimate.yml.

Refactorings

Further Reading

Function componentDidUpdate has a Cognitive Complexity of 7 (exceeds 5 allowed). Consider refactoring.
Open

  componentDidUpdate(prevProps, prevState) {
    if (prevProps.didUpdate !== this.props.didUpdate) {
      if (this.props.didUpdate) {
        this.setState({
          internalDock: true
Severity: Minor
Found in react-app/src/components/Dock.js - About 35 mins to fix

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

mime Regular Expression Denial of Service
Open

    "mime": {
      "version": "1.3.4",
      "resolved": "https://registry.npmjs.org/mime/-/mime-1.3.4.tgz",
      "integrity": "sha1-EV+eO2s9rylZmDyzjxSaLUDrXVM="
    },
Severity: Minor
Found in package-lock.json by nodesecurity

Regular Expression Denial of Service

Overview:

The mime module is vulnerable to regular expression denial of service when a mime lookup is performed on untrusted user input.

Recommendation:

Upgrade to version 2.0.3 or greater.

uglify-js Regular Expression Denial of Service
Open

        "uglify-js": {
          "version": "2.2.5",
          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-2.2.5.tgz",
          "integrity": "sha1-puAqcNg5eSuXgEiLe4sYTAlcmcc=",
          "requires": {
Severity: Minor
Found in package-lock.json by nodesecurity

Regular Expression Denial of Service

Overview:

uglify-js is vulnerable to regular expression denial of service (ReDoS) when certain types of input is passed into .parse().

"The Regular expression Denial of Service (ReDoS) is a Denial of Service attack, that exploits the fact that most Regular Expression implementations may reach extreme situations that cause them to work very slowly (exponentially related to input size). An attacker can then cause a program using a Regular Expression to enter these extreme situations and then hang for a very long time." [1]

Proof of Concept

var u = require('uglify-js');
var genstr = function (len, chr) {
    var result = "";
    for (i=0; i<=len; i++) {
        result = result + chr;
    }

    return result;
}

u.parse("var a = " + genstr(process.argv[2], "1") + ".1ee7;");

Results

$ time node test.js 10000
real    0m1.091s
user    0m1.047s
sys 0m0.039s

$ time node test.js 80000
real    0m6.486s
user    0m6.229s
sys 0m0.094s

Recommendation:

Update to version 2.6.0 or later

Avoid too many return statements within this function.
Open

    return [1, 1, 1]
Severity: Major
Found in react-app/src/helpers/helper-country-point.js - About 30 mins to fix

uglify-js Incorrect Handling of Non-Boolean Comparisons During Minification
Open

        "uglify-js": {
          "version": "2.2.5",
          "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-2.2.5.tgz",
          "integrity": "sha1-puAqcNg5eSuXgEiLe4sYTAlcmcc=",
          "requires": {
Severity: Minor
Found in package-lock.json by nodesecurity

Incorrect Handling of Non-Boolean Comparisons During Minification

Overview:

Tom MacWright discovered that UglifyJS versions 2.4.23 and earlier are affected by a vulnerability which allows a specially crafted Javascript file to have altered functionality after minification. This bug was demonstrated by Yan to allow potentially malicious code to be hidden within secure code, activated by minification.

Details:

In Boolean algebra, DeMorgan's laws describe the relationships between conjunctions ( && ), disjunctions ( || ) and negations ( ! ). In Javascript form, they state that: !(a && b) === (!a) || (!b) !(a || b) === (!a) && (!b)

The law does not hold true when one of the values is not a boolean however.

Vulnerable versions of UglifyJS do not account for this restriction, and erroneously apply the laws to a statement if it can be reduced in length by it.

Consider this authentication function:

function isTokenValid(user) {
    var timeLeft =
        !!config && // config object exists
        !!user.token && // user object has a token
        !user.token.invalidated && // token is not explicitly invalidated
        !config.uninitialized && // config is initialized
        !config.ignoreTimestamps && // don't ignore timestamps
        getTimeLeft(user.token.expiry); // > 0 if expiration is in the future

    // The token must not be expired
    return timeLeft > 0;
}

function getTimeLeft(expiry) {
  return expiry - getSystemTime();
}

When minified with a vulnerable version of UglifyJS, it will produce the following insecure output, where a token will never expire:

( Formatted for readability )

function isTokenValid(user) {
    var timeLeft = !(                       // negation
        !config                             // config object does not exist
        || !user.token                      // user object does not have a token
        || user.token.invalidated           // token is explicitly invalidated
        || config.uninitialized             // config isn't initialized
        || config.ignoreTimestamps          // ignore timestamps
        || !getTimeLeft(user.token.expiry)  // > 0 if expiration is in the future
    );
    return timeLeft > 0
}

function getTimeLeft(expiry) {
    return expiry - getSystemTime()
}

Recommendation:

Upgrade UglifyJS to version >= 2.4.24.

Avoid too many return statements within this function.
Open

      return Object.assign({}, state, {
        polygons: Object.assign({}, country_admins),
        diagonal: diagonal,
        matrix,
        // Set scores to null in case admins were previously selected
Severity: Major
Found in react-app/src/reducers/reducer-active-country.js - About 30 mins to fix

Function arrToGeo has a Cognitive Complexity of 6 (exceeds 5 allowed). Consider refactoring.
Open

const arrToGeo = (params, data) => {
  const toGeo = []
  for (let i = 0; i < data.length; i++) {
    const o = {}
    for (let j = 0; j < params.length; j++) {
Severity: Minor
Found in react-app/src/helpers/helper-2d-geojson.js - About 25 mins to fix

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

'Home' is defined but never used.
Open

import Home from './authorization/Home/Home';
Severity: Minor
Found in react-app/src/index.js by eslint

Disallow Unused Variables (no-unused-vars)

Variables that are declared and not used anywhere in the code are most likely an error due to incomplete refactoring. Such variables take up space in the code and can lead to confusion by readers.

Rule Details

This rule is aimed at eliminating unused variables, functions, and parameters of functions.

A variable is considered to be used if any of the following are true:

  • It represents a function that is called (doSomething())
  • It is read (var y = x)
  • It is passed into a function as an argument (doSomething(x))
  • It is read inside of a function that is passed to another function (doSomething(function() { foo(); }))

A variable is not considered to be used if it is only ever assigned to (var x = 5) or declared.

Examples of incorrect code for this rule:

/*eslint no-unused-vars: "error"*/
/*global some_unused_var*/

// It checks variables you have defined as global
some_unused_var = 42;

var x;

// Write-only variables are not considered as used.
var y = 10;
y = 5;

// A read for a modification of itself is not considered as used.
var z = 0;
z = z + 1;

// By default, unused arguments cause warnings.
(function(foo) {
    return 5;
})();

// Unused recursive functions also cause warnings.
function fact(n) {
    if (n < 2) return 1;
    return n * fact(n - 1);
}

// When a function definition destructures an array, unused entries from the array also cause warnings.
function getY([x, y]) {
    return y;
}

Examples of correct code for this rule:

/*eslint no-unused-vars: "error"*/

var x = 10;
alert(x);

// foo is considered used here
myFunc(function foo() {
    // ...
}.bind(this));

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

var myFunc;
myFunc = setTimeout(function() {
    // myFunc is considered used
    myFunc();
}, 50);

// Only the second argument from the descructured array is used.
function getY([, y]) {
    return y;
}

exported

In environments outside of CommonJS or ECMAScript modules, you may use var to create a global variable that may be used by other scripts. You can use the /* exported variableName */ comment block to indicate that this variable is being exported and therefore should not be considered unused.

Note that /* exported */ has no effect for any of the following:

  • when the environment is node or commonjs
  • when parserOptions.sourceType is module
  • when ecmaFeatures.globalReturn is true

The line comment // exported variableName will not work as exported is not line-specific.

Examples of correct code for /* exported variableName */ operation:

/* exported global_var */

var global_var = 42;

Options

This rule takes one argument which can be a string or an object. The string settings are the same as those of the vars property (explained below).

By default this rule is enabled with all option for variables and after-used for arguments.

{
    "rules": {
        "no-unused-vars": ["error", { "vars": "all", "args": "after-used", "ignoreRestSiblings": false }]
    }
}

vars

The vars option has two settings:

  • all checks all variables for usage, including those in the global scope. This is the default setting.
  • local checks only that locally-declared variables are used but will allow global variables to be unused.

vars: local

Examples of correct code for the { "vars": "local" } option:

/*eslint no-unused-vars: ["error", { "vars": "local" }]*/
/*global some_unused_var */

some_unused_var = 42;

varsIgnorePattern

The varsIgnorePattern option specifies exceptions not to check for usage: variables whose names match a regexp pattern. For example, variables whose names contain ignored or Ignored.

Examples of correct code for the { "varsIgnorePattern": "[iI]gnored" } option:

/*eslint no-unused-vars: ["error", { "varsIgnorePattern": "[iI]gnored" }]*/

var firstVarIgnored = 1;
var secondVar = 2;
console.log(secondVar);

args

The args option has three settings:

  • after-used - only the last argument must be used. This allows you, for instance, to have two named parameters to a function and as long as you use the second argument, ESLint will not warn you about the first. This is the default setting.
  • all - all named arguments must be used.
  • none - do not check arguments.

args: after-used

Examples of incorrect code for the default { "args": "after-used" } option:

/*eslint no-unused-vars: ["error", { "args": "after-used" }]*/

// 1 error
// "baz" is defined but never used
(function(foo, bar, baz) {
    return bar;
})();

Examples of correct code for the default { "args": "after-used" } option:

/*eslint no-unused-vars: ["error", {"args": "after-used"}]*/

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

args: all

Examples of incorrect code for the { "args": "all" } option:

/*eslint no-unused-vars: ["error", { "args": "all" }]*/

// 2 errors
// "foo" is defined but never used
// "baz" is defined but never used
(function(foo, bar, baz) {
    return bar;
})();

args: none

Examples of correct code for the { "args": "none" } option:

/*eslint no-unused-vars: ["error", { "args": "none" }]*/

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

ignoreRestSiblings

The ignoreRestSiblings option is a boolean (default: false). Using a Rest Property it is possible to "omit" properties from an object, but by default the sibling properties are marked as "unused". With this option enabled the rest property's siblings are ignored.

Examples of correct code for the { "ignoreRestSiblings": true } option:

/*eslint no-unused-vars: ["error", { "ignoreRestSiblings": true }]*/
// 'type' is ignored because it has a rest property sibling.
var { type, ...coords } = data;

argsIgnorePattern

The argsIgnorePattern option specifies exceptions not to check for usage: arguments whose names match a regexp pattern. For example, variables whose names begin with an underscore.

Examples of correct code for the { "argsIgnorePattern": "^_" } option:

/*eslint no-unused-vars: ["error", { "argsIgnorePattern": "^_" }]*/

function foo(x, _y) {
    return x + 1;
}
foo();

caughtErrors

The caughtErrors option is used for catch block arguments validation.

It has two settings:

  • none - do not check error objects. This is the default setting.
  • all - all named arguments must be used.

caughtErrors: none

Not specifying this rule is equivalent of assigning it to none.

Examples of correct code for the { "caughtErrors": "none" } option:

/*eslint no-unused-vars: ["error", { "caughtErrors": "none" }]*/

try {
    //...
} catch (err) {
    console.error("errors");
}

caughtErrors: all

Examples of incorrect code for the { "caughtErrors": "all" } option:

/*eslint no-unused-vars: ["error", { "caughtErrors": "all" }]*/

// 1 error
// "err" is defined but never used
try {
    //...
} catch (err) {
    console.error("errors");
}

caughtErrorsIgnorePattern

The caughtErrorsIgnorePattern option specifies exceptions not to check for usage: catch arguments whose names match a regexp pattern. For example, variables whose names begin with a string 'ignore'.

Examples of correct code for the { "caughtErrorsIgnorePattern": "^ignore" } option:

/*eslint no-unused-vars: ["error", { "caughtErrorsIgnorePattern": "^ignore" }]*/

try {
    //...
} catch (ignoreErr) {
    console.error("errors");
}

When Not To Use It

If you don't want to be notified about unused variables or function arguments, you can safely turn this rule off. Source: http://eslint.org/docs/rules/

'Callback' is defined but never used.
Open

import Callback from './authorization/Callback/Callback';
Severity: Minor
Found in react-app/src/index.js by eslint

Disallow Unused Variables (no-unused-vars)

Variables that are declared and not used anywhere in the code are most likely an error due to incomplete refactoring. Such variables take up space in the code and can lead to confusion by readers.

Rule Details

This rule is aimed at eliminating unused variables, functions, and parameters of functions.

A variable is considered to be used if any of the following are true:

  • It represents a function that is called (doSomething())
  • It is read (var y = x)
  • It is passed into a function as an argument (doSomething(x))
  • It is read inside of a function that is passed to another function (doSomething(function() { foo(); }))

A variable is not considered to be used if it is only ever assigned to (var x = 5) or declared.

Examples of incorrect code for this rule:

/*eslint no-unused-vars: "error"*/
/*global some_unused_var*/

// It checks variables you have defined as global
some_unused_var = 42;

var x;

// Write-only variables are not considered as used.
var y = 10;
y = 5;

// A read for a modification of itself is not considered as used.
var z = 0;
z = z + 1;

// By default, unused arguments cause warnings.
(function(foo) {
    return 5;
})();

// Unused recursive functions also cause warnings.
function fact(n) {
    if (n < 2) return 1;
    return n * fact(n - 1);
}

// When a function definition destructures an array, unused entries from the array also cause warnings.
function getY([x, y]) {
    return y;
}

Examples of correct code for this rule:

/*eslint no-unused-vars: "error"*/

var x = 10;
alert(x);

// foo is considered used here
myFunc(function foo() {
    // ...
}.bind(this));

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

var myFunc;
myFunc = setTimeout(function() {
    // myFunc is considered used
    myFunc();
}, 50);

// Only the second argument from the descructured array is used.
function getY([, y]) {
    return y;
}

exported

In environments outside of CommonJS or ECMAScript modules, you may use var to create a global variable that may be used by other scripts. You can use the /* exported variableName */ comment block to indicate that this variable is being exported and therefore should not be considered unused.

Note that /* exported */ has no effect for any of the following:

  • when the environment is node or commonjs
  • when parserOptions.sourceType is module
  • when ecmaFeatures.globalReturn is true

The line comment // exported variableName will not work as exported is not line-specific.

Examples of correct code for /* exported variableName */ operation:

/* exported global_var */

var global_var = 42;

Options

This rule takes one argument which can be a string or an object. The string settings are the same as those of the vars property (explained below).

By default this rule is enabled with all option for variables and after-used for arguments.

{
    "rules": {
        "no-unused-vars": ["error", { "vars": "all", "args": "after-used", "ignoreRestSiblings": false }]
    }
}

vars

The vars option has two settings:

  • all checks all variables for usage, including those in the global scope. This is the default setting.
  • local checks only that locally-declared variables are used but will allow global variables to be unused.

vars: local

Examples of correct code for the { "vars": "local" } option:

/*eslint no-unused-vars: ["error", { "vars": "local" }]*/
/*global some_unused_var */

some_unused_var = 42;

varsIgnorePattern

The varsIgnorePattern option specifies exceptions not to check for usage: variables whose names match a regexp pattern. For example, variables whose names contain ignored or Ignored.

Examples of correct code for the { "varsIgnorePattern": "[iI]gnored" } option:

/*eslint no-unused-vars: ["error", { "varsIgnorePattern": "[iI]gnored" }]*/

var firstVarIgnored = 1;
var secondVar = 2;
console.log(secondVar);

args

The args option has three settings:

  • after-used - only the last argument must be used. This allows you, for instance, to have two named parameters to a function and as long as you use the second argument, ESLint will not warn you about the first. This is the default setting.
  • all - all named arguments must be used.
  • none - do not check arguments.

args: after-used

Examples of incorrect code for the default { "args": "after-used" } option:

/*eslint no-unused-vars: ["error", { "args": "after-used" }]*/

// 1 error
// "baz" is defined but never used
(function(foo, bar, baz) {
    return bar;
})();

Examples of correct code for the default { "args": "after-used" } option:

/*eslint no-unused-vars: ["error", {"args": "after-used"}]*/

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

args: all

Examples of incorrect code for the { "args": "all" } option:

/*eslint no-unused-vars: ["error", { "args": "all" }]*/

// 2 errors
// "foo" is defined but never used
// "baz" is defined but never used
(function(foo, bar, baz) {
    return bar;
})();

args: none

Examples of correct code for the { "args": "none" } option:

/*eslint no-unused-vars: ["error", { "args": "none" }]*/

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

ignoreRestSiblings

The ignoreRestSiblings option is a boolean (default: false). Using a Rest Property it is possible to "omit" properties from an object, but by default the sibling properties are marked as "unused". With this option enabled the rest property's siblings are ignored.

Examples of correct code for the { "ignoreRestSiblings": true } option:

/*eslint no-unused-vars: ["error", { "ignoreRestSiblings": true }]*/
// 'type' is ignored because it has a rest property sibling.
var { type, ...coords } = data;

argsIgnorePattern

The argsIgnorePattern option specifies exceptions not to check for usage: arguments whose names match a regexp pattern. For example, variables whose names begin with an underscore.

Examples of correct code for the { "argsIgnorePattern": "^_" } option:

/*eslint no-unused-vars: ["error", { "argsIgnorePattern": "^_" }]*/

function foo(x, _y) {
    return x + 1;
}
foo();

caughtErrors

The caughtErrors option is used for catch block arguments validation.

It has two settings:

  • none - do not check error objects. This is the default setting.
  • all - all named arguments must be used.

caughtErrors: none

Not specifying this rule is equivalent of assigning it to none.

Examples of correct code for the { "caughtErrors": "none" } option:

/*eslint no-unused-vars: ["error", { "caughtErrors": "none" }]*/

try {
    //...
} catch (err) {
    console.error("errors");
}

caughtErrors: all

Examples of incorrect code for the { "caughtErrors": "all" } option:

/*eslint no-unused-vars: ["error", { "caughtErrors": "all" }]*/

// 1 error
// "err" is defined but never used
try {
    //...
} catch (err) {
    console.error("errors");
}

caughtErrorsIgnorePattern

The caughtErrorsIgnorePattern option specifies exceptions not to check for usage: catch arguments whose names match a regexp pattern. For example, variables whose names begin with a string 'ignore'.

Examples of correct code for the { "caughtErrorsIgnorePattern": "^ignore" } option:

/*eslint no-unused-vars: ["error", { "caughtErrorsIgnorePattern": "^ignore" }]*/

try {
    //...
} catch (ignoreErr) {
    console.error("errors");
}

When Not To Use It

If you don't want to be notified about unused variables or function arguments, you can safely turn this rule off. Source: http://eslint.org/docs/rules/

Expected indentation of 4 spaces but found 6.
Open

      <App />
Severity: Minor
Found in react-app/src/index.js by eslint

enforce consistent indentation (indent)

There are several common guidelines which require specific indentation of nested blocks and statements, like:

function hello(indentSize, type) {
    if (indentSize === 4 && type !== 'tab') {
        console.log('Each next indentation will increase on 4 spaces');
    }
}

These are the most common scenarios recommended in different style guides:

  • Two spaces, not longer and no tabs: Google, npm, Node.js, Idiomatic, Felix
  • Tabs: jQuery
  • Four spaces: Crockford

Rule Details

This rule enforces a consistent indentation style. The default style is 4 spaces.

Options

This rule has a mixed option:

For example, for 2-space indentation:

{
    "indent": ["error", 2]
}

Or for tabbed indentation:

{
    "indent": ["error", "tab"]
}

Examples of incorrect code for this rule with the default options:

/*eslint indent: "error"*/

if (a) {
  b=c;
  function foo(d) {
    e=f;
  }
}

Examples of correct code for this rule with the default options:

/*eslint indent: "error"*/

if (a) {
    b=c;
    function foo(d) {
        e=f;
    }
}

This rule has an object option:

  • "SwitchCase" (default: 0) enforces indentation level for case clauses in switch statements
  • "VariableDeclarator" (default: 1) enforces indentation level for var declarators; can also take an object to define separate rules for var, let and const declarations.
  • "outerIIFEBody" (default: 1) enforces indentation level for file-level IIFEs.
  • "MemberExpression" (default: 1) enforces indentation level for multi-line property chains. This can also be set to "off" to disable checking for MemberExpression indentation.
  • "FunctionDeclaration" takes an object to define rules for function declarations.
    • parameters (default: 1) enforces indentation level for parameters in a function declaration. This can either be a number indicating indentation level, or the string "first" indicating that all parameters of the declaration must be aligned with the first parameter. This can also be set to "off" to disable checking for FunctionDeclaration parameters.
    • body (default: 1) enforces indentation level for the body of a function declaration.
  • "FunctionExpression" takes an object to define rules for function expressions.
    • parameters (default: 1) enforces indentation level for parameters in a function expression. This can either be a number indicating indentation level, or the string "first" indicating that all parameters of the expression must be aligned with the first parameter. This can also be set to "off" to disable checking for FunctionExpression parameters.
    • body (default: 1) enforces indentation level for the body of a function expression.
  • "CallExpression" takes an object to define rules for function call expressions.
    • arguments (default: 1) enforces indentation level for arguments in a call expression. This can either be a number indicating indentation level, or the string "first" indicating that all arguments of the expression must be aligned with the first argument. This can also be set to "off" to disable checking for CallExpression arguments.
  • "ArrayExpression" (default: 1) enforces indentation level for elements in arrays. It can also be set to the string "first", indicating that all the elements in the array should be aligned with the first element. This can also be set to "off" to disable checking for array elements.
  • "ObjectExpression" (default: 1) enforces indentation level for properties in objects. It can be set to the string "first", indicating that all properties in the object should be aligned with the first property. This can also be set to "off" to disable checking for object properties.
  • "ImportDeclaration" (default: 1) enforces indentation level for import statements. It can be set to the string "first", indicating that all imported members from a module should be aligned with the first member in the list. This can also be set to "off" to disable checking for imported module members.
  • "flatTernaryExpressions": true (false by default) requires no indentation for ternary expressions which are nested in other ternary expressions.
  • "ignoredNodes" accepts an array of selectors. If an AST node is matched by any of the selectors, the indentation of tokens which are direct children of that node will be ignored. This can be used as an escape hatch to relax the rule if you disagree with the indentation that it enforces for a particular syntactic pattern.
  • "ignoreComments" (default: false) can be used when comments do not need to be aligned with nodes on the previous or next line.

Level of indentation denotes the multiple of the indent specified. Example:

  • Indent of 4 spaces with VariableDeclarator set to 2 will indent the multi-line variable declarations with 8 spaces.
  • Indent of 2 spaces with VariableDeclarator set to 2 will indent the multi-line variable declarations with 4 spaces.
  • Indent of 2 spaces with VariableDeclarator set to {"var": 2, "let": 2, "const": 3} will indent the multi-line variable declarations with 4 spaces for var and let, 6 spaces for const statements.
  • Indent of tab with VariableDeclarator set to 2 will indent the multi-line variable declarations with 2 tabs.
  • Indent of 2 spaces with SwitchCase set to 0 will not indent case clauses with respect to switch statements.
  • Indent of 2 spaces with SwitchCase set to 1 will indent case clauses with 2 spaces with respect to switch statements.
  • Indent of 2 spaces with SwitchCase set to 2 will indent case clauses with 4 spaces with respect to switch statements.
  • Indent of tab with SwitchCase set to 2 will indent case clauses with 2 tabs with respect to switch statements.
  • Indent of 2 spaces with MemberExpression set to 0 will indent the multi-line property chains with 0 spaces.
  • Indent of 2 spaces with MemberExpression set to 1 will indent the multi-line property chains with 2 spaces.
  • Indent of 2 spaces with MemberExpression set to 2 will indent the multi-line property chains with 4 spaces.
  • Indent of 4 spaces with MemberExpression set to 0 will indent the multi-line property chains with 0 spaces.
  • Indent of 4 spaces with MemberExpression set to 1 will indent the multi-line property chains with 4 spaces.
  • Indent of 4 spaces with MemberExpression set to 2 will indent the multi-line property chains with 8 spaces.

tab

Examples of incorrect code for this rule with the "tab" option:

/*eslint indent: ["error", "tab"]*/

if (a) {
     b=c;
function foo(d) {
           e=f;
 }
}

Examples of correct code for this rule with the "tab" option:

/*eslint indent: ["error", "tab"]*/

if (a) {
/*tab*/b=c;
/*tab*/function foo(d) {
/*tab*//*tab*/e=f;
/*tab*/}
}

SwitchCase

Examples of incorrect code for this rule with the 2, { "SwitchCase": 1 } options:

/*eslint indent: ["error", 2, { "SwitchCase": 1 }]*/

switch(a){
case "a":
    break;
case "b":
    break;
}

Examples of correct code for this rule with the 2, { "SwitchCase": 1 } option:

/*eslint indent: ["error", 2, { "SwitchCase": 1 }]*/

switch(a){
  case "a":
    break;
  case "b":
    break;
}

VariableDeclarator

Examples of incorrect code for this rule with the 2, { "VariableDeclarator": 1 } options:

/*eslint indent: ["error", 2, { "VariableDeclarator": 1 }]*/
/*eslint-env es6*/

var a,
    b,
    c;
let a,
    b,
    c;
const a = 1,
    b = 2,
    c = 3;

Examples of correct code for this rule with the 2, { "VariableDeclarator": 1 } options:

/*eslint indent: ["error", 2, { "VariableDeclarator": 1 }]*/
/*eslint-env es6*/

var a,
  b,
  c;
let a,
  b,
  c;
const a = 1,
  b = 2,
  c = 3;

Examples of correct code for this rule with the 2, { "VariableDeclarator": 2 } options:

/*eslint indent: ["error", 2, { "VariableDeclarator": 2 }]*/
/*eslint-env es6*/

var a,
    b,
    c;
let a,
    b,
    c;
const a = 1,
    b = 2,
    c = 3;

Examples of correct code for this rule with the 2, { "VariableDeclarator": { "var": 2, "let": 2, "const": 3 } } options:

/*eslint indent: ["error", 2, { "VariableDeclarator": { "var": 2, "let": 2, "const": 3 } }]*/
/*eslint-env es6*/

var a,
    b,
    c;
let a,
    b,
    c;
const a = 1,
      b = 2,
      c = 3;

outerIIFEBody

Examples of incorrect code for this rule with the options 2, { "outerIIFEBody": 0 }:

/*eslint indent: ["error", 2, { "outerIIFEBody": 0 }]*/

(function() {

  function foo(x) {
    return x + 1;
  }

})();


if(y) {
console.log('foo');
}

Examples of correct code for this rule with the options 2, {"outerIIFEBody": 0}:

/*eslint indent: ["error", 2, { "outerIIFEBody": 0 }]*/

(function() {

function foo(x) {
  return x + 1;
}

})();


if(y) {
   console.log('foo');
}

MemberExpression

Examples of incorrect code for this rule with the 2, { "MemberExpression": 1 } options:

/*eslint indent: ["error", 2, { "MemberExpression": 1 }]*/

foo
.bar
.baz()

Examples of correct code for this rule with the 2, { "MemberExpression": 1 } option:

/*eslint indent: ["error", 2, { "MemberExpression": 1 }]*/

foo
  .bar
  .baz();

FunctionDeclaration

Examples of incorrect code for this rule with the 2, { "FunctionDeclaration": {"body": 1, "parameters": 2} } option:

/*eslint indent: ["error", 2, { "FunctionDeclaration": {"body": 1, "parameters": 2} }]*/

function foo(bar,
  baz,
  qux) {
    qux();
}

Examples of correct code for this rule with the 2, { "FunctionDeclaration": {"body": 1, "parameters": 2} } option:

/*eslint indent: ["error", 2, { "FunctionDeclaration": {"body": 1, "parameters": 2} }]*/

function foo(bar,
    baz,
    qux) {
  qux();
}

Examples of incorrect code for this rule with the 2, { "FunctionDeclaration": {"parameters": "first"} } option:

/*eslint indent: ["error", 2, {"FunctionDeclaration": {"parameters": "first"}}]*/

function foo(bar, baz,
  qux, boop) {
  qux();
}

Examples of correct code for this rule with the 2, { "FunctionDeclaration": {"parameters": "first"} } option:

/*eslint indent: ["error", 2, {"FunctionDeclaration": {"parameters": "first"}}]*/

function foo(bar, baz,
             qux, boop) {
  qux();
}

FunctionExpression

Examples of incorrect code for this rule with the 2, { "FunctionExpression": {"body": 1, "parameters": 2} } option:

/*eslint indent: ["error", 2, { "FunctionExpression": {"body": 1, "parameters": 2} }]*/

var foo = function(bar,
  baz,
  qux) {
    qux();
}

Examples of correct code for this rule with the 2, { "FunctionExpression": {"body": 1, "parameters": 2} } option:

/*eslint indent: ["error", 2, { "FunctionExpression": {"body": 1, "parameters": 2} }]*/

var foo = function(bar,
    baz,
    qux) {
  qux();
}

Examples of incorrect code for this rule with the 2, { "FunctionExpression": {"parameters": "first"} } option:

/*eslint indent: ["error", 2, {"FunctionExpression": {"parameters": "first"}}]*/

var foo = function(bar, baz,
  qux, boop) {
  qux();
}

Examples of correct code for this rule with the 2, { "FunctionExpression": {"parameters": "first"} } option:

/*eslint indent: ["error", 2, {"FunctionExpression": {"parameters": "first"}}]*/

var foo = function(bar, baz,
                   qux, boop) {
  qux();
}

CallExpression

Examples of incorrect code for this rule with the 2, { "CallExpression": {"arguments": 1} } option:

/*eslint indent: ["error", 2, { "CallExpression": {"arguments": 1} }]*/

foo(bar,
    baz,
      qux
);

Examples of correct code for this rule with the 2, { "CallExpression": {"arguments": 1} } option:

/*eslint indent: ["error", 2, { "CallExpression": {"arguments": 1} }]*/

foo(bar,
  baz,
  qux
);

Examples of incorrect code for this rule with the 2, { "CallExpression": {"arguments": "first"} } option:

/*eslint indent: ["error", 2, {"CallExpression": {"arguments": "first"}}]*/

foo(bar, baz,
  baz, boop, beep);

Examples of correct code for this rule with the 2, { "CallExpression": {"arguments": "first"} } option:

/*eslint indent: ["error", 2, {"CallExpression": {"arguments": "first"}}]*/

foo(bar, baz,
    baz, boop, beep);

ArrayExpression

Examples of incorrect code for this rule with the 2, { "ArrayExpression": 1 } option:

/*eslint indent: ["error", 2, { "ArrayExpression": 1 }]*/

var foo = [
    bar,
baz,
      qux
];

Examples of correct code for this rule with the 2, { "ArrayExpression": 1 } option:

/*eslint indent: ["error", 2, { "ArrayExpression": 1 }]*/

var foo = [
  bar,
  baz,
  qux
];

Examples of incorrect code for this rule with the 2, { "ArrayExpression": "first" } option:

/*eslint indent: ["error", 2, {"ArrayExpression": "first"}]*/

var foo = [bar,
  baz,
  qux
];

Examples of correct code for this rule with the 2, { "ArrayExpression": "first" } option:

/*eslint indent: ["error", 2, {"ArrayExpression": "first"}]*/

var foo = [bar,
           baz,
           qux
];

ObjectExpression

Examples of incorrect code for this rule with the 2, { "ObjectExpression": 1 } option:

/*eslint indent: ["error", 2, { "ObjectExpression": 1 }]*/

var foo = {
    bar: 1,
baz: 2,
      qux: 3
};

Examples of correct code for this rule with the 2, { "ObjectExpression": 1 } option:

/*eslint indent: ["error", 2, { "ObjectExpression": 1 }]*/

var foo = {
  bar: 1,
  baz: 2,
  qux: 3
};

Examples of incorrect code for this rule with the 2, { "ObjectExpression": "first" } option:

/*eslint indent: ["error", 2, {"ObjectExpression": "first"}]*/

var foo = { bar: 1,
  baz: 2 };

Examples of correct code for this rule with the 2, { "ObjectExpression": "first" } option:

/*eslint indent: ["error", 2, {"ObjectExpression": "first"}]*/

var foo = { bar: 1,
            baz: 2 };

ImportDeclaration

Examples of correct code for this rule with the 4, { "ImportDeclaration": 1 } option (the default):

/*eslint indent: ["error", 4, { ImportDeclaration: 1 }]*/

import { foo,
    bar,
    baz,
} from 'qux';

import {
    foo,
    bar,
    baz,
} from 'qux';

Examples of incorrect code for this rule with the 4, { ImportDeclaration: "first" } option:

/*eslint indent: ["error", 4, { ImportDeclaration: "first" }]*/

import { foo,
    bar,
    baz,
} from 'qux';

Examples of correct code for this rule with the 4, { ImportDeclaration: "first" } option:

/*eslint indent: ["error", 4, { ImportDeclaration: "first" }]*/

import { foo,
         bar,
         baz,
} from 'qux';

flatTernaryExpressions

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

/*eslint indent: ["error", 4, { "flatTernaryExpressions": false }]*/

var a =
    foo ? bar :
    baz ? qux :
    boop;

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

/*eslint indent: ["error", 4, { "flatTernaryExpressions": false }]*/

var a =
    foo ? bar :
        baz ? qux :
            boop;

Examples of incorrect code for this rule with the 4, { "flatTernaryExpressions": true } option:

/*eslint indent: ["error", 4, { "flatTernaryExpressions": true }]*/

var a =
    foo ? bar :
        baz ? qux :
            boop;

Examples of correct code for this rule with the 4, { "flatTernaryExpressions": true } option:

/*eslint indent: ["error", 4, { "flatTernaryExpressions": true }]*/

var a =
    foo ? bar :
    baz ? qux :
    boop;

ignoredNodes

The following configuration ignores the indentation of ConditionalExpression ("ternary expression") nodes:

Examples of correct code for this rule with the 4, { "ignoredNodes": ["ConditionalExpression"] } option:

/*eslint indent: ["error", 4, { "ignoredNodes": ["ConditionalExpression"] }]*/

var a = foo
      ? bar
      : baz;

var a = foo
                ? bar
: baz;

The following configuration ignores indentation in the body of IIFEs.

Examples of correct code for this rule with the 4, { "ignoredNodes": ["CallExpression > FunctionExpression.callee > BlockStatement.body"] } option:

/*eslint indent: ["error", 4, { "ignoredNodes": ["CallExpression > FunctionExpression.callee > BlockStatement.body"] }]*/

(function() {

foo();
bar();

})

ignoreComments

Examples of additional correct code for this rule with the 4, { "ignoreComments": true } option:

/*eslint indent: ["error", 4, { "ignoreComments": true }] */

if (foo) {
    doSomething();

// comment intentionally de-indented
    doSomethingElse();
}

Compatibility

'Shield' is defined but never used.
Open

import Shield from './authorization/Shield';
Severity: Minor
Found in react-app/src/index.js by eslint

Disallow Unused Variables (no-unused-vars)

Variables that are declared and not used anywhere in the code are most likely an error due to incomplete refactoring. Such variables take up space in the code and can lead to confusion by readers.

Rule Details

This rule is aimed at eliminating unused variables, functions, and parameters of functions.

A variable is considered to be used if any of the following are true:

  • It represents a function that is called (doSomething())
  • It is read (var y = x)
  • It is passed into a function as an argument (doSomething(x))
  • It is read inside of a function that is passed to another function (doSomething(function() { foo(); }))

A variable is not considered to be used if it is only ever assigned to (var x = 5) or declared.

Examples of incorrect code for this rule:

/*eslint no-unused-vars: "error"*/
/*global some_unused_var*/

// It checks variables you have defined as global
some_unused_var = 42;

var x;

// Write-only variables are not considered as used.
var y = 10;
y = 5;

// A read for a modification of itself is not considered as used.
var z = 0;
z = z + 1;

// By default, unused arguments cause warnings.
(function(foo) {
    return 5;
})();

// Unused recursive functions also cause warnings.
function fact(n) {
    if (n < 2) return 1;
    return n * fact(n - 1);
}

// When a function definition destructures an array, unused entries from the array also cause warnings.
function getY([x, y]) {
    return y;
}

Examples of correct code for this rule:

/*eslint no-unused-vars: "error"*/

var x = 10;
alert(x);

// foo is considered used here
myFunc(function foo() {
    // ...
}.bind(this));

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

var myFunc;
myFunc = setTimeout(function() {
    // myFunc is considered used
    myFunc();
}, 50);

// Only the second argument from the descructured array is used.
function getY([, y]) {
    return y;
}

exported

In environments outside of CommonJS or ECMAScript modules, you may use var to create a global variable that may be used by other scripts. You can use the /* exported variableName */ comment block to indicate that this variable is being exported and therefore should not be considered unused.

Note that /* exported */ has no effect for any of the following:

  • when the environment is node or commonjs
  • when parserOptions.sourceType is module
  • when ecmaFeatures.globalReturn is true

The line comment // exported variableName will not work as exported is not line-specific.

Examples of correct code for /* exported variableName */ operation:

/* exported global_var */

var global_var = 42;

Options

This rule takes one argument which can be a string or an object. The string settings are the same as those of the vars property (explained below).

By default this rule is enabled with all option for variables and after-used for arguments.

{
    "rules": {
        "no-unused-vars": ["error", { "vars": "all", "args": "after-used", "ignoreRestSiblings": false }]
    }
}

vars

The vars option has two settings:

  • all checks all variables for usage, including those in the global scope. This is the default setting.
  • local checks only that locally-declared variables are used but will allow global variables to be unused.

vars: local

Examples of correct code for the { "vars": "local" } option:

/*eslint no-unused-vars: ["error", { "vars": "local" }]*/
/*global some_unused_var */

some_unused_var = 42;

varsIgnorePattern

The varsIgnorePattern option specifies exceptions not to check for usage: variables whose names match a regexp pattern. For example, variables whose names contain ignored or Ignored.

Examples of correct code for the { "varsIgnorePattern": "[iI]gnored" } option:

/*eslint no-unused-vars: ["error", { "varsIgnorePattern": "[iI]gnored" }]*/

var firstVarIgnored = 1;
var secondVar = 2;
console.log(secondVar);

args

The args option has three settings:

  • after-used - only the last argument must be used. This allows you, for instance, to have two named parameters to a function and as long as you use the second argument, ESLint will not warn you about the first. This is the default setting.
  • all - all named arguments must be used.
  • none - do not check arguments.

args: after-used

Examples of incorrect code for the default { "args": "after-used" } option:

/*eslint no-unused-vars: ["error", { "args": "after-used" }]*/

// 1 error
// "baz" is defined but never used
(function(foo, bar, baz) {
    return bar;
})();

Examples of correct code for the default { "args": "after-used" } option:

/*eslint no-unused-vars: ["error", {"args": "after-used"}]*/

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

args: all

Examples of incorrect code for the { "args": "all" } option:

/*eslint no-unused-vars: ["error", { "args": "all" }]*/

// 2 errors
// "foo" is defined but never used
// "baz" is defined but never used
(function(foo, bar, baz) {
    return bar;
})();

args: none

Examples of correct code for the { "args": "none" } option:

/*eslint no-unused-vars: ["error", { "args": "none" }]*/

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

ignoreRestSiblings

The ignoreRestSiblings option is a boolean (default: false). Using a Rest Property it is possible to "omit" properties from an object, but by default the sibling properties are marked as "unused". With this option enabled the rest property's siblings are ignored.

Examples of correct code for the { "ignoreRestSiblings": true } option:

/*eslint no-unused-vars: ["error", { "ignoreRestSiblings": true }]*/
// 'type' is ignored because it has a rest property sibling.
var { type, ...coords } = data;

argsIgnorePattern

The argsIgnorePattern option specifies exceptions not to check for usage: arguments whose names match a regexp pattern. For example, variables whose names begin with an underscore.

Examples of correct code for the { "argsIgnorePattern": "^_" } option:

/*eslint no-unused-vars: ["error", { "argsIgnorePattern": "^_" }]*/

function foo(x, _y) {
    return x + 1;
}
foo();

caughtErrors

The caughtErrors option is used for catch block arguments validation.

It has two settings:

  • none - do not check error objects. This is the default setting.
  • all - all named arguments must be used.

caughtErrors: none

Not specifying this rule is equivalent of assigning it to none.

Examples of correct code for the { "caughtErrors": "none" } option:

/*eslint no-unused-vars: ["error", { "caughtErrors": "none" }]*/

try {
    //...
} catch (err) {
    console.error("errors");
}

caughtErrors: all

Examples of incorrect code for the { "caughtErrors": "all" } option:

/*eslint no-unused-vars: ["error", { "caughtErrors": "all" }]*/

// 1 error
// "err" is defined but never used
try {
    //...
} catch (err) {
    console.error("errors");
}

caughtErrorsIgnorePattern

The caughtErrorsIgnorePattern option specifies exceptions not to check for usage: catch arguments whose names match a regexp pattern. For example, variables whose names begin with a string 'ignore'.

Examples of correct code for the { "caughtErrorsIgnorePattern": "^ignore" } option:

/*eslint no-unused-vars: ["error", { "caughtErrorsIgnorePattern": "^ignore" }]*/

try {
    //...
} catch (ignoreErr) {
    console.error("errors");
}

When Not To Use It

If you don't want to be notified about unused variables or function arguments, you can safely turn this rule off. Source: http://eslint.org/docs/rules/

Expected indentation of 2 spaces but found 4.
Open

    <Provider store={store}>
Severity: Minor
Found in react-app/src/index.js by eslint

enforce consistent indentation (indent)

There are several common guidelines which require specific indentation of nested blocks and statements, like:

function hello(indentSize, type) {
    if (indentSize === 4 && type !== 'tab') {
        console.log('Each next indentation will increase on 4 spaces');
    }
}

These are the most common scenarios recommended in different style guides:

  • Two spaces, not longer and no tabs: Google, npm, Node.js, Idiomatic, Felix
  • Tabs: jQuery
  • Four spaces: Crockford

Rule Details

This rule enforces a consistent indentation style. The default style is 4 spaces.

Options

This rule has a mixed option:

For example, for 2-space indentation:

{
    "indent": ["error", 2]
}

Or for tabbed indentation:

{
    "indent": ["error", "tab"]
}

Examples of incorrect code for this rule with the default options:

/*eslint indent: "error"*/

if (a) {
  b=c;
  function foo(d) {
    e=f;
  }
}

Examples of correct code for this rule with the default options:

/*eslint indent: "error"*/

if (a) {
    b=c;
    function foo(d) {
        e=f;
    }
}

This rule has an object option:

  • "SwitchCase" (default: 0) enforces indentation level for case clauses in switch statements
  • "VariableDeclarator" (default: 1) enforces indentation level for var declarators; can also take an object to define separate rules for var, let and const declarations.
  • "outerIIFEBody" (default: 1) enforces indentation level for file-level IIFEs.
  • "MemberExpression" (default: 1) enforces indentation level for multi-line property chains. This can also be set to "off" to disable checking for MemberExpression indentation.
  • "FunctionDeclaration" takes an object to define rules for function declarations.
    • parameters (default: 1) enforces indentation level for parameters in a function declaration. This can either be a number indicating indentation level, or the string "first" indicating that all parameters of the declaration must be aligned with the first parameter. This can also be set to "off" to disable checking for FunctionDeclaration parameters.
    • body (default: 1) enforces indentation level for the body of a function declaration.
  • "FunctionExpression" takes an object to define rules for function expressions.
    • parameters (default: 1) enforces indentation level for parameters in a function expression. This can either be a number indicating indentation level, or the string "first" indicating that all parameters of the expression must be aligned with the first parameter. This can also be set to "off" to disable checking for FunctionExpression parameters.
    • body (default: 1) enforces indentation level for the body of a function expression.
  • "CallExpression" takes an object to define rules for function call expressions.
    • arguments (default: 1) enforces indentation level for arguments in a call expression. This can either be a number indicating indentation level, or the string "first" indicating that all arguments of the expression must be aligned with the first argument. This can also be set to "off" to disable checking for CallExpression arguments.
  • "ArrayExpression" (default: 1) enforces indentation level for elements in arrays. It can also be set to the string "first", indicating that all the elements in the array should be aligned with the first element. This can also be set to "off" to disable checking for array elements.
  • "ObjectExpression" (default: 1) enforces indentation level for properties in objects. It can be set to the string "first", indicating that all properties in the object should be aligned with the first property. This can also be set to "off" to disable checking for object properties.
  • "ImportDeclaration" (default: 1) enforces indentation level for import statements. It can be set to the string "first", indicating that all imported members from a module should be aligned with the first member in the list. This can also be set to "off" to disable checking for imported module members.
  • "flatTernaryExpressions": true (false by default) requires no indentation for ternary expressions which are nested in other ternary expressions.
  • "ignoredNodes" accepts an array of selectors. If an AST node is matched by any of the selectors, the indentation of tokens which are direct children of that node will be ignored. This can be used as an escape hatch to relax the rule if you disagree with the indentation that it enforces for a particular syntactic pattern.
  • "ignoreComments" (default: false) can be used when comments do not need to be aligned with nodes on the previous or next line.

Level of indentation denotes the multiple of the indent specified. Example:

  • Indent of 4 spaces with VariableDeclarator set to 2 will indent the multi-line variable declarations with 8 spaces.
  • Indent of 2 spaces with VariableDeclarator set to 2 will indent the multi-line variable declarations with 4 spaces.
  • Indent of 2 spaces with VariableDeclarator set to {"var": 2, "let": 2, "const": 3} will indent the multi-line variable declarations with 4 spaces for var and let, 6 spaces for const statements.
  • Indent of tab with VariableDeclarator set to 2 will indent the multi-line variable declarations with 2 tabs.
  • Indent of 2 spaces with SwitchCase set to 0 will not indent case clauses with respect to switch statements.
  • Indent of 2 spaces with SwitchCase set to 1 will indent case clauses with 2 spaces with respect to switch statements.
  • Indent of 2 spaces with SwitchCase set to 2 will indent case clauses with 4 spaces with respect to switch statements.
  • Indent of tab with SwitchCase set to 2 will indent case clauses with 2 tabs with respect to switch statements.
  • Indent of 2 spaces with MemberExpression set to 0 will indent the multi-line property chains with 0 spaces.
  • Indent of 2 spaces with MemberExpression set to 1 will indent the multi-line property chains with 2 spaces.
  • Indent of 2 spaces with MemberExpression set to 2 will indent the multi-line property chains with 4 spaces.
  • Indent of 4 spaces with MemberExpression set to 0 will indent the multi-line property chains with 0 spaces.
  • Indent of 4 spaces with MemberExpression set to 1 will indent the multi-line property chains with 4 spaces.
  • Indent of 4 spaces with MemberExpression set to 2 will indent the multi-line property chains with 8 spaces.

tab

Examples of incorrect code for this rule with the "tab" option:

/*eslint indent: ["error", "tab"]*/

if (a) {
     b=c;
function foo(d) {
           e=f;
 }
}

Examples of correct code for this rule with the "tab" option:

/*eslint indent: ["error", "tab"]*/

if (a) {
/*tab*/b=c;
/*tab*/function foo(d) {
/*tab*//*tab*/e=f;
/*tab*/}
}

SwitchCase

Examples of incorrect code for this rule with the 2, { "SwitchCase": 1 } options:

/*eslint indent: ["error", 2, { "SwitchCase": 1 }]*/

switch(a){
case "a":
    break;
case "b":
    break;
}

Examples of correct code for this rule with the 2, { "SwitchCase": 1 } option:

/*eslint indent: ["error", 2, { "SwitchCase": 1 }]*/

switch(a){
  case "a":
    break;
  case "b":
    break;
}

VariableDeclarator

Examples of incorrect code for this rule with the 2, { "VariableDeclarator": 1 } options:

/*eslint indent: ["error", 2, { "VariableDeclarator": 1 }]*/
/*eslint-env es6*/

var a,
    b,
    c;
let a,
    b,
    c;
const a = 1,
    b = 2,
    c = 3;

Examples of correct code for this rule with the 2, { "VariableDeclarator": 1 } options:

/*eslint indent: ["error", 2, { "VariableDeclarator": 1 }]*/
/*eslint-env es6*/

var a,
  b,
  c;
let a,
  b,
  c;
const a = 1,
  b = 2,
  c = 3;

Examples of correct code for this rule with the 2, { "VariableDeclarator": 2 } options:

/*eslint indent: ["error", 2, { "VariableDeclarator": 2 }]*/
/*eslint-env es6*/

var a,
    b,
    c;
let a,
    b,
    c;
const a = 1,
    b = 2,
    c = 3;

Examples of correct code for this rule with the 2, { "VariableDeclarator": { "var": 2, "let": 2, "const": 3 } } options:

/*eslint indent: ["error", 2, { "VariableDeclarator": { "var": 2, "let": 2, "const": 3 } }]*/
/*eslint-env es6*/

var a,
    b,
    c;
let a,
    b,
    c;
const a = 1,
      b = 2,
      c = 3;

outerIIFEBody

Examples of incorrect code for this rule with the options 2, { "outerIIFEBody": 0 }:

/*eslint indent: ["error", 2, { "outerIIFEBody": 0 }]*/

(function() {

  function foo(x) {
    return x + 1;
  }

})();


if(y) {
console.log('foo');
}

Examples of correct code for this rule with the options 2, {"outerIIFEBody": 0}:

/*eslint indent: ["error", 2, { "outerIIFEBody": 0 }]*/

(function() {

function foo(x) {
  return x + 1;
}

})();


if(y) {
   console.log('foo');
}

MemberExpression

Examples of incorrect code for this rule with the 2, { "MemberExpression": 1 } options:

/*eslint indent: ["error", 2, { "MemberExpression": 1 }]*/

foo
.bar
.baz()

Examples of correct code for this rule with the 2, { "MemberExpression": 1 } option:

/*eslint indent: ["error", 2, { "MemberExpression": 1 }]*/

foo
  .bar
  .baz();

FunctionDeclaration

Examples of incorrect code for this rule with the 2, { "FunctionDeclaration": {"body": 1, "parameters": 2} } option:

/*eslint indent: ["error", 2, { "FunctionDeclaration": {"body": 1, "parameters": 2} }]*/

function foo(bar,
  baz,
  qux) {
    qux();
}

Examples of correct code for this rule with the 2, { "FunctionDeclaration": {"body": 1, "parameters": 2} } option:

/*eslint indent: ["error", 2, { "FunctionDeclaration": {"body": 1, "parameters": 2} }]*/

function foo(bar,
    baz,
    qux) {
  qux();
}

Examples of incorrect code for this rule with the 2, { "FunctionDeclaration": {"parameters": "first"} } option:

/*eslint indent: ["error", 2, {"FunctionDeclaration": {"parameters": "first"}}]*/

function foo(bar, baz,
  qux, boop) {
  qux();
}

Examples of correct code for this rule with the 2, { "FunctionDeclaration": {"parameters": "first"} } option:

/*eslint indent: ["error", 2, {"FunctionDeclaration": {"parameters": "first"}}]*/

function foo(bar, baz,
             qux, boop) {
  qux();
}

FunctionExpression

Examples of incorrect code for this rule with the 2, { "FunctionExpression": {"body": 1, "parameters": 2} } option:

/*eslint indent: ["error", 2, { "FunctionExpression": {"body": 1, "parameters": 2} }]*/

var foo = function(bar,
  baz,
  qux) {
    qux();
}

Examples of correct code for this rule with the 2, { "FunctionExpression": {"body": 1, "parameters": 2} } option:

/*eslint indent: ["error", 2, { "FunctionExpression": {"body": 1, "parameters": 2} }]*/

var foo = function(bar,
    baz,
    qux) {
  qux();
}

Examples of incorrect code for this rule with the 2, { "FunctionExpression": {"parameters": "first"} } option:

/*eslint indent: ["error", 2, {"FunctionExpression": {"parameters": "first"}}]*/

var foo = function(bar, baz,
  qux, boop) {
  qux();
}

Examples of correct code for this rule with the 2, { "FunctionExpression": {"parameters": "first"} } option:

/*eslint indent: ["error", 2, {"FunctionExpression": {"parameters": "first"}}]*/

var foo = function(bar, baz,
                   qux, boop) {
  qux();
}

CallExpression

Examples of incorrect code for this rule with the 2, { "CallExpression": {"arguments": 1} } option:

/*eslint indent: ["error", 2, { "CallExpression": {"arguments": 1} }]*/

foo(bar,
    baz,
      qux
);

Examples of correct code for this rule with the 2, { "CallExpression": {"arguments": 1} } option:

/*eslint indent: ["error", 2, { "CallExpression": {"arguments": 1} }]*/

foo(bar,
  baz,
  qux
);

Examples of incorrect code for this rule with the 2, { "CallExpression": {"arguments": "first"} } option:

/*eslint indent: ["error", 2, {"CallExpression": {"arguments": "first"}}]*/

foo(bar, baz,
  baz, boop, beep);

Examples of correct code for this rule with the 2, { "CallExpression": {"arguments": "first"} } option:

/*eslint indent: ["error", 2, {"CallExpression": {"arguments": "first"}}]*/

foo(bar, baz,
    baz, boop, beep);

ArrayExpression

Examples of incorrect code for this rule with the 2, { "ArrayExpression": 1 } option:

/*eslint indent: ["error", 2, { "ArrayExpression": 1 }]*/

var foo = [
    bar,
baz,
      qux
];

Examples of correct code for this rule with the 2, { "ArrayExpression": 1 } option:

/*eslint indent: ["error", 2, { "ArrayExpression": 1 }]*/

var foo = [
  bar,
  baz,
  qux
];

Examples of incorrect code for this rule with the 2, { "ArrayExpression": "first" } option:

/*eslint indent: ["error", 2, {"ArrayExpression": "first"}]*/

var foo = [bar,
  baz,
  qux
];

Examples of correct code for this rule with the 2, { "ArrayExpression": "first" } option:

/*eslint indent: ["error", 2, {"ArrayExpression": "first"}]*/

var foo = [bar,
           baz,
           qux
];

ObjectExpression

Examples of incorrect code for this rule with the 2, { "ObjectExpression": 1 } option:

/*eslint indent: ["error", 2, { "ObjectExpression": 1 }]*/

var foo = {
    bar: 1,
baz: 2,
      qux: 3
};

Examples of correct code for this rule with the 2, { "ObjectExpression": 1 } option:

/*eslint indent: ["error", 2, { "ObjectExpression": 1 }]*/

var foo = {
  bar: 1,
  baz: 2,
  qux: 3
};

Examples of incorrect code for this rule with the 2, { "ObjectExpression": "first" } option:

/*eslint indent: ["error", 2, {"ObjectExpression": "first"}]*/

var foo = { bar: 1,
  baz: 2 };

Examples of correct code for this rule with the 2, { "ObjectExpression": "first" } option:

/*eslint indent: ["error", 2, {"ObjectExpression": "first"}]*/

var foo = { bar: 1,
            baz: 2 };

ImportDeclaration

Examples of correct code for this rule with the 4, { "ImportDeclaration": 1 } option (the default):

/*eslint indent: ["error", 4, { ImportDeclaration: 1 }]*/

import { foo,
    bar,
    baz,
} from 'qux';

import {
    foo,
    bar,
    baz,
} from 'qux';

Examples of incorrect code for this rule with the 4, { ImportDeclaration: "first" } option:

/*eslint indent: ["error", 4, { ImportDeclaration: "first" }]*/

import { foo,
    bar,
    baz,
} from 'qux';

Examples of correct code for this rule with the 4, { ImportDeclaration: "first" } option:

/*eslint indent: ["error", 4, { ImportDeclaration: "first" }]*/

import { foo,
         bar,
         baz,
} from 'qux';

flatTernaryExpressions

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

/*eslint indent: ["error", 4, { "flatTernaryExpressions": false }]*/

var a =
    foo ? bar :
    baz ? qux :
    boop;

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

/*eslint indent: ["error", 4, { "flatTernaryExpressions": false }]*/

var a =
    foo ? bar :
        baz ? qux :
            boop;

Examples of incorrect code for this rule with the 4, { "flatTernaryExpressions": true } option:

/*eslint indent: ["error", 4, { "flatTernaryExpressions": true }]*/

var a =
    foo ? bar :
        baz ? qux :
            boop;

Examples of correct code for this rule with the 4, { "flatTernaryExpressions": true } option:

/*eslint indent: ["error", 4, { "flatTernaryExpressions": true }]*/

var a =
    foo ? bar :
    baz ? qux :
    boop;

ignoredNodes

The following configuration ignores the indentation of ConditionalExpression ("ternary expression") nodes:

Examples of correct code for this rule with the 4, { "ignoredNodes": ["ConditionalExpression"] } option:

/*eslint indent: ["error", 4, { "ignoredNodes": ["ConditionalExpression"] }]*/

var a = foo
      ? bar
      : baz;

var a = foo
                ? bar
: baz;

The following configuration ignores indentation in the body of IIFEs.

Examples of correct code for this rule with the 4, { "ignoredNodes": ["CallExpression > FunctionExpression.callee > BlockStatement.body"] } option:

/*eslint indent: ["error", 4, { "ignoredNodes": ["CallExpression > FunctionExpression.callee > BlockStatement.body"] }]*/

(function() {

foo();
bar();

})

ignoreComments

Examples of additional correct code for this rule with the 4, { "ignoreComments": true } option:

/*eslint indent: ["error", 4, { "ignoreComments": true }] */

if (foo) {
    doSomething();

// comment intentionally de-indented
    doSomethingElse();
}

Compatibility

'Router' is defined but never used.
Open

import {Route, Router} from 'react-router-dom';
Severity: Minor
Found in react-app/src/index.js by eslint

Disallow Unused Variables (no-unused-vars)

Variables that are declared and not used anywhere in the code are most likely an error due to incomplete refactoring. Such variables take up space in the code and can lead to confusion by readers.

Rule Details

This rule is aimed at eliminating unused variables, functions, and parameters of functions.

A variable is considered to be used if any of the following are true:

  • It represents a function that is called (doSomething())
  • It is read (var y = x)
  • It is passed into a function as an argument (doSomething(x))
  • It is read inside of a function that is passed to another function (doSomething(function() { foo(); }))

A variable is not considered to be used if it is only ever assigned to (var x = 5) or declared.

Examples of incorrect code for this rule:

/*eslint no-unused-vars: "error"*/
/*global some_unused_var*/

// It checks variables you have defined as global
some_unused_var = 42;

var x;

// Write-only variables are not considered as used.
var y = 10;
y = 5;

// A read for a modification of itself is not considered as used.
var z = 0;
z = z + 1;

// By default, unused arguments cause warnings.
(function(foo) {
    return 5;
})();

// Unused recursive functions also cause warnings.
function fact(n) {
    if (n < 2) return 1;
    return n * fact(n - 1);
}

// When a function definition destructures an array, unused entries from the array also cause warnings.
function getY([x, y]) {
    return y;
}

Examples of correct code for this rule:

/*eslint no-unused-vars: "error"*/

var x = 10;
alert(x);

// foo is considered used here
myFunc(function foo() {
    // ...
}.bind(this));

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

var myFunc;
myFunc = setTimeout(function() {
    // myFunc is considered used
    myFunc();
}, 50);

// Only the second argument from the descructured array is used.
function getY([, y]) {
    return y;
}

exported

In environments outside of CommonJS or ECMAScript modules, you may use var to create a global variable that may be used by other scripts. You can use the /* exported variableName */ comment block to indicate that this variable is being exported and therefore should not be considered unused.

Note that /* exported */ has no effect for any of the following:

  • when the environment is node or commonjs
  • when parserOptions.sourceType is module
  • when ecmaFeatures.globalReturn is true

The line comment // exported variableName will not work as exported is not line-specific.

Examples of correct code for /* exported variableName */ operation:

/* exported global_var */

var global_var = 42;

Options

This rule takes one argument which can be a string or an object. The string settings are the same as those of the vars property (explained below).

By default this rule is enabled with all option for variables and after-used for arguments.

{
    "rules": {
        "no-unused-vars": ["error", { "vars": "all", "args": "after-used", "ignoreRestSiblings": false }]
    }
}

vars

The vars option has two settings:

  • all checks all variables for usage, including those in the global scope. This is the default setting.
  • local checks only that locally-declared variables are used but will allow global variables to be unused.

vars: local

Examples of correct code for the { "vars": "local" } option:

/*eslint no-unused-vars: ["error", { "vars": "local" }]*/
/*global some_unused_var */

some_unused_var = 42;

varsIgnorePattern

The varsIgnorePattern option specifies exceptions not to check for usage: variables whose names match a regexp pattern. For example, variables whose names contain ignored or Ignored.

Examples of correct code for the { "varsIgnorePattern": "[iI]gnored" } option:

/*eslint no-unused-vars: ["error", { "varsIgnorePattern": "[iI]gnored" }]*/

var firstVarIgnored = 1;
var secondVar = 2;
console.log(secondVar);

args

The args option has three settings:

  • after-used - only the last argument must be used. This allows you, for instance, to have two named parameters to a function and as long as you use the second argument, ESLint will not warn you about the first. This is the default setting.
  • all - all named arguments must be used.
  • none - do not check arguments.

args: after-used

Examples of incorrect code for the default { "args": "after-used" } option:

/*eslint no-unused-vars: ["error", { "args": "after-used" }]*/

// 1 error
// "baz" is defined but never used
(function(foo, bar, baz) {
    return bar;
})();

Examples of correct code for the default { "args": "after-used" } option:

/*eslint no-unused-vars: ["error", {"args": "after-used"}]*/

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

args: all

Examples of incorrect code for the { "args": "all" } option:

/*eslint no-unused-vars: ["error", { "args": "all" }]*/

// 2 errors
// "foo" is defined but never used
// "baz" is defined but never used
(function(foo, bar, baz) {
    return bar;
})();

args: none

Examples of correct code for the { "args": "none" } option:

/*eslint no-unused-vars: ["error", { "args": "none" }]*/

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

ignoreRestSiblings

The ignoreRestSiblings option is a boolean (default: false). Using a Rest Property it is possible to "omit" properties from an object, but by default the sibling properties are marked as "unused". With this option enabled the rest property's siblings are ignored.

Examples of correct code for the { "ignoreRestSiblings": true } option:

/*eslint no-unused-vars: ["error", { "ignoreRestSiblings": true }]*/
// 'type' is ignored because it has a rest property sibling.
var { type, ...coords } = data;

argsIgnorePattern

The argsIgnorePattern option specifies exceptions not to check for usage: arguments whose names match a regexp pattern. For example, variables whose names begin with an underscore.

Examples of correct code for the { "argsIgnorePattern": "^_" } option:

/*eslint no-unused-vars: ["error", { "argsIgnorePattern": "^_" }]*/

function foo(x, _y) {
    return x + 1;
}
foo();

caughtErrors

The caughtErrors option is used for catch block arguments validation.

It has two settings:

  • none - do not check error objects. This is the default setting.
  • all - all named arguments must be used.

caughtErrors: none

Not specifying this rule is equivalent of assigning it to none.

Examples of correct code for the { "caughtErrors": "none" } option:

/*eslint no-unused-vars: ["error", { "caughtErrors": "none" }]*/

try {
    //...
} catch (err) {
    console.error("errors");
}

caughtErrors: all

Examples of incorrect code for the { "caughtErrors": "all" } option:

/*eslint no-unused-vars: ["error", { "caughtErrors": "all" }]*/

// 1 error
// "err" is defined but never used
try {
    //...
} catch (err) {
    console.error("errors");
}

caughtErrorsIgnorePattern

The caughtErrorsIgnorePattern option specifies exceptions not to check for usage: catch arguments whose names match a regexp pattern. For example, variables whose names begin with a string 'ignore'.

Examples of correct code for the { "caughtErrorsIgnorePattern": "^ignore" } option:

/*eslint no-unused-vars: ["error", { "caughtErrorsIgnorePattern": "^ignore" }]*/

try {
    //...
} catch (ignoreErr) {
    console.error("errors");
}

When Not To Use It

If you don't want to be notified about unused variables or function arguments, you can safely turn this rule off. Source: http://eslint.org/docs/rules/

Severity
Category
Status
Source
Language