🚀 Harness AI to execute your million-dollar ideas 10x faster, with 1/10th the effort.Get Started

Disable ESLint Rules with Comment Syntax

3/5/2019

Learn all the ways to disable ESLint (JavaScript lint library) rules with the comment syntax.

Ignore ESLint rules for file

In general, using file level eslint-disable is an indicator that the code needs to be fixed rather than ignored, but there are definitely times when using eslint-disable at the file level is necessary.

Ignore all rules for a file

Syntax: /* eslint-disable */

Example:

/* eslint-disable */
var myObj = {};

Ignore single rule for a file

Syntax: /* eslint-disable <rule> */

Example (using no-unused-vars):

/* eslint-disable no-unused-vars */
var myObj = {};

Ignore multiple ESLint rules for a file

Syntax: /* eslint-disable <rule>, <rule>, <etc> */

Example (using no-unused-vars and no-shadow):

/* eslint-disable no-unused-vars, no-shadow */
var myObj = { old: "thing" };

function myFunc() {
  var myObj = { new: "thing" };
}

Ignore ESLint rules in a block of code

Sometimes you may want to ignore a rule inside of a block of code and re-enable outside of it.

Ignore all rules in a block of code

Syntax:

/* eslint-disable */ 
	/* ...block of code... */ 
/* eslint-enable */

Example:

var myObj = { old: "thing" };

/* eslint-disable */
function myFunc() {
  var myObj = { new: "thing" };
}

function myFunc2() {
  var myObj = { new: "thing" };
}
/* eslint-enable */

Ignore single rule in a block of code

Syntax: /* eslint-disable <rule> */ /* ...block of code... */ /* eslint-enable <rule> */

Example (using no-shadow):

var myObj = { old: "thing" };

/* eslint-disable no-shadow */
function myFunc() {
  var myObj = { new: "thing" };
}

function myFunc2() {
  var myObj = { new: "thing" };
}
/* eslint-enable no-shadow */

Ignore multiple rules in a block of code

Syntax: /* eslint-disable <rule>, <rule>, <etc> */ /* ...block of code... */ /* eslint-enable <rule>, <rule>, <etc> */

Example (using no-shadow and no-unused-vars):

var myObj = { old: "thing" };

/* eslint-disable no-shadow, no-unused-vars */
function myFunc() {
  var myObj = { new: "thing" };
}

function myFunc2() {
  var myObj = { new: "thing" };
}
/* eslint-enable no-shadow, no-unused-vars */

Ignore ESLint rules for current line

This is useful for ignoring rules for a single line. I find it useful because if code gets moved around, it guarantees that the eslint-disable comment is preserved with the code it's meant for.

Ignore all rules for current line

Syntax: // eslint-disable-line

Example:

var myObj = {}; // eslint-disable-line

Ignore single rule for current line

Syntax: // eslint-disable-line <rule>

Example (using no-var):

var myObj = {}; // eslint-disable-line no-var

Ignore multiple rules for current line

Syntax: // eslint-disable-line <rule>, <rule>, <etc>

Example (using no-var and no-unused-vars):

var myObj = {}; //eslint-disable-line no-var, no-unused-vars

Ignore ESLint rules for next line

This is useful for when you have a declaration/definition that spans multiple lines. Some examples of this may be multi-line imports or destructuring, multi-line function definitions or multi-line object definitions.

Ignore all rules for next line

Syntax: // eslint-disable-next-line

Example:

// eslint-disable-next-line
module.exports = () => {
  /* lots of code here, all covered under the eslint-disable comment */
};

Ignore single rule for next line

Syntax: // eslint-disable-next-line <rule>

Example (using no-unused-vars):

// eslint-disable-next-line no-unused-vars
module.exports = () => {
  /* lots of code here, all covered under the eslint-disable comment */
};

Ignore multiple rules for next line

Syntax: // eslint-disable-next-line <rule>, <rule>, <etc>

Example (using no-var and no-unused-vars):

// eslint-disable-next-line no-var, no-unused-vars
module.exports = () => {
  var myObj = {};
  /* lots of code here, all covered under the eslint-disable comment */
};
Chase Adams