'NextJS - Linter with lint-staged not working

I've set up lint-staged and husky with NextJS. When we run yarn lint, it calls yarn next lint under the hood and it works. When we call yarn lint-staged, we receive an error:

✖ yarn lint:
> Couldn't find a `pages` directory. Please create one under the project root

The point is that pages directory exists under src and it should work. What is going on?

package.json:

{
  "scripts": {
    "lint": "next lint"
  },
  "lint-staged": {
    "src/**/*.{ts,tsx}": [
      "yarn lint"
    ]
  }
}


Solution 1:[1]

use "eslint" instead of "yarn lint" under lint-staged.

I believe next lint has some inherent configurations that aren't compatible with lint-staged.

"eslint" catches the intended error during pre-commits

package.json

{
  "scripts": {
    "lint": "next lint"
  },
  "lint-staged": {
    "src/**/*.{ts,tsx}": [
      "eslint"
    ]
  }
}

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Nelson Lee