0
votes

Can eslint be configured to report only a certain subset of errors without explicitly settings all other rules as false

My use case is I want to have a separate report for a11y related errors coming from eslint-plugin-jsx-a11y

So I have a package scripts like

"lint": "eslint .",
"lint.a11y": "eslint --no-eslintrc -c .eslintrc.a11y.js .",

The general config used in lint covers everything and is used in the IDE and during CI to validate code style

The lin.a11y serves only to provide a report on accessibility violations

Currently I use something like this (the idea was borrowed from eslint:all):

const builtInRules = require('eslint/lib/rules');

const disabledRules = {};

for (const [ruleId, rule] of builtInRules) {
  if (!rule.meta.deprecated) {
    disabledRules[ruleId] = 'off';
  }
}

module.exports = {
  parser: 'babel-eslint',
  extends: ['plugin:jsx-a11y/recommended'],
  plugins: ['jsx-a11y'],
  rules: {
    // Lint only a11y, disable other js style related rules
    ...disabledRules,
  },
};

This almost works, but when there exception to the rules disabled with code comments (disable rule for the line). I'll get an error like "Definition for rule ... was not found":

Definition for rule 'react-hooks/exhaustive-deps' was not found react-hooks/exhaustive-deps

So now I have to import my default eslint configuration, extend it, disable any rules defined there, disable any other rules coming from other plugins, just so that errors for inline comments are disregarded

1

1 Answers

0
votes

I created a custom eslint reported that will:

  • print a general output for all errors including a11y
  • save a report containing only a11y errors/warnings
const fs = require('fs');

const fileFormatter = require('eslint/lib/cli-engine/formatters/html');
const outputFormatter = require('eslint/lib/cli-engine/formatters/stylish');

function formatter(results = [], data) {
  saveA11yReport(results, data);
  const output = outputFormatter(results, data);

  return output;
}

function saveA11yReport(results, data) {
  // a11y errors and warnings
  const a11yRelated = results
    .filter(r => r.messages.some(m => m.ruleId.startsWith('jsx-a11y/')))
    .map(r => {
      const messages = r.messages.filter(m => m.ruleId.startsWith('jsx-a11y/'));

      return {
        ...r,
        messages,
        errorCount: messages.filter(m => m.severity == 2).length,
        warningCount: messages.filter(m => m.severity == 1).length,
      };
    });

  const a11yHtml = fileFormatter(a11yRelated, data);

  fs.writeFileSync('./dist/a11y.report.html', a11yHtml, 'utf8');
}

module.exports = formatter;

eslint -f ./custom-lint-formatter.js "./src/**/*.{js,jsx,ts,tsx}"