Is there a way to programmatically suppress all ESLint errors on a line by line basis?

Question

If I add any given ESLint rule, for example no-param-reassign in an existing codebase I'm likely to get many violations.

Is there a good way to programmatically add, on line-by-line bases, suppressions for all existing violations?

In the example case:

// eslint-diable-next-line no-param-reassign
param = foo;

To clarify

I do want the rule in my project, guarding all new code we write. I don't want to fix all the old code that is emitting violations by hand (I want a script to do that for me or eslint itself if possible). This is why I would like to suppress all existing violations but respect all new violations. My main goal is to comply with the new rule as fast as possible to get the value from it on all new code. I don't mind old lingering suppressed violations.

Answer 1

I was having this same issue with a bunch of react-hooks/exhaustive-deps lint warnings ended up using the json formatter and a script to insert the eslint disable comment. I ran yarn lint . -f json -o warnings.json to get the json list of lints and then this

const json = require('./warnings.json');
const fs = require('fs');

json.forEach(({ filePath, messages, source }) => {
  // if there is no source we have nothing that needs to be eslint-ignore'd
  if (!source) {
    return;
  }

  const data = source.split('\n');

  // if the source has multiple lines which need to be eslint-ignored our offset changes per addition
  // offset is 1 because line numbers start at 1 but index numbers in an array start at 0
  let offset = 1;

  // group errors/warnings by line because we want to have one eslint disable comment with all the rules to disable
  const groupedMessages = messages.reduce((acc, next) => {
    const prevMessages = acc[next.line] ? acc[next.line] : [];
    // some lines may have the same rule twice
    const duplicateRuleForLine = prevMessages.find(message => message.ruleId === next.ruleId);
    // ignore jsx and graphql lint rules
    const applicableRule = next.ruleId && !next.ruleId.includes('jsx') && !next.ruleId.includes('graphql');

    // ignore the eslint-ignore addition for duplicates and non applicable rules
    if (duplicateRuleForLine || !applicableRule) {
      return acc;
    }

    return {
      ...acc,
      [next.line]: [...prevMessages, next],
    };
  }, {});

  Object.entries(groupedMessages).forEach(([line, messages]) => {
    // grouped ignores
    const ignore = `// eslint-disable-next-line ${messages.map(({ ruleId }) => ruleId).join(' ')}`;
    data.splice(line - offset, 0, ignore);
    offset--;
  });

  const updated = data.join('\n');

  fs.writeFile(filePath, updated, function(err) {
    if (err) return console.log(err);
  });
});

Worked out well for me, although I wish these comments I inserted were auto-formatted.

Answer 2

I use this typically: https://github.com/amanda-mitchell/suppress-eslint-errors

Getting jscodemod configured for your repo is a bit tough, but worth it once you get it working. A lot of powerful codemods out there.

Answer 3

I tried suppress-eslint-errors npm answered by @user15185791, but it did not work with ESLint8. But, I was able to find https://github.com/mizdra/eslint-interactive from that npm issue. So far this wonderful npm is working perfectly.

The execution is as follows command.

yarn add -D eslint-interactive
yarn eslint-interactive src
yarn remove eslint-interactive

Answer 4

You can remove the particular rule that you don't want in your project by modifying the .eslintrc.* file or an eslintConfig field in a package.json file. As they are responsible for the rules in your project. If you remove any rule from them, your editor will stop looking for that violation.

If you still want those rule for future development then don't modify your rules config file, instead of that there are two things that you can do,

1. Suppress the old code that is violating the rules.

2. Fix them. (recommended)

Answer 5

For an individual line:

// eslint-disable-next-line

For a block

/* eslint-disable */
// liniting issues here
/* eslint-enable */

Without eslint-disable, linting will be disabled for the rest of the file

Answer 6

In order to accomplish what you want, you should disable eslint for those old files that you want ESLint to ignore completely. Add this to the top of your old files:

/* eslint-disable */

Here are more ways to accomplish different disabling:

• Turning off eslint rule for a specific file
• http://www.justthink.it/articles/turn-off-eslint-rule-via-config-file-via-javascript/

Answer 7

If you don’t want to go file by file adding these directives, you could use ESLint overrides feature. In .eslintrc:

{
  /*
    Main set of properties here
    ...
  */
  overrides: [
    {
      files: [
        /*
          List of glob patterns matching files that should have
          some rules overwritten
        */
      ],
      rules: [
        /* 
          Add the common rules here, otherwise they'll be overwritten.
          After that, add the ones you want to disable:
        */
        no-param-reassign: 0,
      ]
    },
  ],
}

Otherwise, if you want to disable a rule in a single line, you just need to do like this:

// eslint-disable-nex-line <rule name>

Finally, if you want to disable a rule in many lines of code, you can use:

// eslint-disable <rule name>

// Code on which the rule shouldn't be applied
// ...

// eslint-enable <rule name>