eslint resolve error on imports using with path mapping configured jsconfig.json : <p>Here's my project structure:</p>

<pre><code>-src

--assets
--components
--constants
--helpers
--pages
--routes

eslintrc.json
jsconfig.json
App.js
index.js

</code></pre>

<p>I was tired of:</p>

<p><code>import SomeComponent from '../../../../../components/SomeComponent';</code></p>

<p>And I wanted to do:</p>

<p><code>import SomeComponent from '@components/SomeComponent';</code></p>

<p>So I saw this question here on SO:</p>

<p><a href="https://stackoverflow.com/questions/47181037/vscode-intellisense-does-not-work-with-webpack-alias">VSCode Intellisense does not work with webpack + alias</a></p>

<p>And I got it to work with:</p>

<p><strong>jsconfig.json</strong></p>

<pre><code>{
  "compilerOptions": {
    "baseUrl": ".",
    "target": "es6",
    "module": "commonjs",
    "paths": {
      "@components/*": ["./src/components/*"]
     }
  }
}
</code></pre>

<p>But eslint now it's complaining that it's unresolved, even though it compiles just fine.</p>

<p><strong>eslint error:</strong></p>

<blockquote>
  <p>Unable to resolve path to module '@components/SocialMedia'.eslint(import/no-unresolved)</p>
</blockquote>

<p><strong>NOTE:</strong> </p>

<p>I don't want to disable eslint. I want to make it understand this kind of path too.</p>
