Disable ESLint Rules with Comment Syntax
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 */
};