How to remove ESlint error no-unresolved from importing 'react'

Question

no-unresolved https://github.com/benmosher/eslint-plugin-import/blob/master/docs/rules/no-unresolved.md

After installing eslint-import-resolver-webpack

Answer 1

Try installing eslint-import-resolver-webpack and adding this to your .eslintrc:

"settings": {
  "import/resolver": "webpack"
}

Answer 2

Try

resolve: {
    modules: [path.resolve(__dirname, 'public/src'), 'node_modules', path.resolve('node_modules')],
}

Answer 3

You can add an option to ignore case:

"rules": {
   "import/no-unresolved": [
      2, 
      { "caseSensitive": false }
   ]
}

This thread at github also describes how the linter was checking case for parts of the path which come before the folder containing package.json. If you for example have the path: C:/Workspace/app and you navigate to it using cd C:/workspace/app (lowercase workspace), the linter would also give an error on the imports. Looks like it should now be fixed, but perhaps you are still using an older version.

Answer 4

The problem is that your webpack config is written in ES6 format, which doesn't play well with eslint-import-resolver-webpack.

So, you either refactor your webpack.config.js using ES5 syntax, or you get rid of eslint-import-resolver-webpack.

See here for the full solution: eslint plugin docs