lint-staged: lint-staged is not taking .eslintrc.js configuration.

[BUG]

Description

I have created 2 package.json npm scripts:

     "lint-staged:test": "lint-staged",
     "eslint:test": "eslint --fix src/global/AppRouter/AppRouter.tsx",

My configuration for lint-staged looks like;

"lint-staged": {
    "*.tsx": [
      "eslint --fix",
      "git add"
    ]
  }

By running yarn eslint:test or npm run eslint:test I’ve got no errors. Like on the image attached: image

But by running second command (“lint-staged:test”) I’ve got some errors related with the file that was checked with the first command. Image shows it: image

Those are my rules for eslint (.eslinrc.js file):

module.exports = {
  parser: '@typescript-eslint/parser', // Specifies the ESLint parser
  extends: ['plugin:@typescript-eslint/recommended', 'plugin:react/recommended', 'plugin:prettier/recommended'],
  parserOptions: {
    ecmaVersion: 2018, // Allows for the parsing of modern ECMAScript features
    sourceType: 'module', // Allows for the use of imports
    ecmaFeatures: {
      jsx: true, // Allows for the parsing of JSX
    },
  },
  rules: {
    // Place to specify ESLint rules. Can be used to overwrite rules specified from the extended configs
    // e.g. "@typescript-eslint/explicit-function-return-type": "off",

    // note you must disable the base rule as it can report incorrect errors
    indent: 'off',
    '@typescript-eslint/indent': ['error', 2],
  },
  settings: {
    react: {
      version: 'detect', // Tells eslint-plugin-react to automatically detect the version of React to use
    },
  },
};

which are applied for the first command but are not applied for lint-staged.

Some possible solutions?

Environment

  • OS: Windows 10,
  • Node.js: v10.13.0,
  • lint-staged: 9.2.1,
  • eslint: 5.3.0",

About this issue

  • Original URL
  • State: closed
  • Created 5 years ago
  • Reactions: 22
  • Comments: 20 (3 by maintainers)

Commits related to this issue

Most upvoted comments

I started running into this issue too and running the eslint --fix command by itself works but when run via lint-staged the config seems to be being dropped

I think I found the issue. my changes to .eslintrc.js also needed to be staged, by the looks of it? either way, git adding the eslintrc file stopped the error.

@husseinbob yeah, lint-staged will hide unstaged changes before running tasks, so at that point eslint would see the old version of your config.

I work with a monorepo structure, I ran into the same error.

I tried the following configuration into the .lintstagerc.json

It used to be:

{
  "*.{js,jsx}": ["prettier --write", "eslint --fix --quiet", "git add"],
  "*.{ts,tsx}": ["prettier --write", "eslint --fix --quiet", "git add"],
  "*.{scss,scss,css,md,html}": ["prettier --write", "git add"]
}

Now it looks like this:

{
  "*.{js,jsx}": ["prettier --write", "eslint --fix --quiet --config .eslintrc.json --resolve-plugins-relative-to .", "git add"],
  "*.{ts,tsx}": ["prettier --write", "eslint --fix --quiet --config .eslintrc.json --resolve-plugins-relative-to .", "git add"],
  "*.{scss,scss,css,md,html}": ["prettier --write", "git add"]
}

No issues after that, you should give it a try.

The following config --resolve-plugins-relative-to . is related to a eslint-plugin-@typescript-eslint, so probably won’t be relevant.

In your eslint config you have specified this rule '@typescript-eslint/indent': ['error', 2],. When lint-staged runs, it is showing errors related to this rule. To me this seems correct.

I think your issue is the other way around: your plain eslint command is not picking up the configuration.

Eslint errors show it wants 4 spaces instead of 2.

This rule says I want 2 spaces: '@typescript-eslint/indent': ['error', 2], And I have got them.

Eslint error says “Expected indentation of 4 spaces but found 2”.

So eslint is using this rule: '@typescript-eslint/indent': ['error', 4],

Anyway, I have solved this problem with:

  • changing .eslinrc.js file to JSON format instead of .js it is .eslintrc.json
  • commit with --no-verify flag (it looks like lint-staged messed up with some of my files or my IDE showed me them incorrectly - JetBrains WebStorm)

Anyway x2, solved.