Custom .eslintrc with eslint-plugin-import working for relative imports

[caub]

If you want to have your custom .eslintrc file, here's how to configure

you need to npm i -D eslint eslint-import-resolver-webpack eslint-plugin-import ..other eslint plugins

and configure eslint-import-resolver-webpack package like this

{
  "extends": [
    "eslint:recommended",
    "plugin:import/recommended",
    // ...
  ],
  "plugins": [
    "import",
    // ...
  ],
  "settings": {
    "import/resolver": {
      "webpack": {
        "config": "./node_modules/react-scripts/config/webpack.config.js"
      }
    }
  },
}

This will work very soon as https://github.com/benmosher/eslint-plugin-import/pull/1276/files got merged, it's probably not yet on npm, be patient

[AgainPsychoX]

I got:
Error resolving webpackConfig Error: The NODE_ENV environment variable is required but was not specified.

And adding env to import/resolver settings didn't help:

	"settings": {
		"import/resolver": {
			"webpack": {
				"config": "../node_modules/react-scripts/config/webpack.config.js"
				"env": {
					"NODE_ENV": "production", // It does not get passed for react-scripts :C
				}
			}
		},

Solution

I had to use set NODE_ENV before using the eslint because the resolver for webpack does not provide NODE_ENV while loading the webpack config file (https://github.com/benmosher/eslint-plugin-import/blob/master/resolvers/webpack/index.js#L86), which is required for react-scripts/config/env.js that is used by the webpack.config.js.

As I am using Windows, I added this to my package.json scripts:

"lint": "cross-env NODE_ENV=production npx eslint src/",

[caub]

yes correct, I have an npm script like NODE_ENV=local eslint . --quiet

[ahmedadelbayoumi]

Unfortunately this doesn't work either.

This article helped me with this issue. By setting the "moduleDirectory" to the "src" folder and "node_modules", the app compiles with no issues and vscode doesn't have any errors.

Hope this helps!

[caub]

yes, I indeed have a jsconfig.json file with

{
  "compilerOptions": {
    "baseUrl": "src"
  }
}