title: eslint / typescript: Unable to resolve path to module
body: <p>My <code>.eslintrc.json</code> is:</p>
  <pre><code>{
      &quot;env&quot;: {
          &quot;browser&quot;: true,
          &quot;commonjs&quot;: true,
          &quot;es6&quot;: true,
          &quot;node&quot;: true,
          &quot;jest&quot;: true
      },
      &quot;parserOptions&quot;: {
          &quot;ecmaFeatures&quot;: {
              &quot;jsx&quot;: true
          },
          &quot;sourceType&quot;: &quot;module&quot;
      },
      &quot;plugins&quot;: [
          &quot;react&quot;,
          &quot;prettier&quot;,
          &quot;import&quot;
      ],
      &quot;extends&quot;: [
          &quot;airbnb&quot;,
          &quot;airbnb/hooks&quot;,
          &quot;plugin:@typescript-eslint/recommended&quot;,
          &quot;plugin:react/recommended&quot;,
          &quot;plugin:import/errors&quot;,
          &quot;plugin:import/warnings&quot;,
          &quot;plugin:import/typescript&quot;,
          &quot;prettier&quot;
      ],
      &quot;root&quot;: true,
      &quot;rules&quot;: {
          &quot;no-const-assign&quot;: 1,
          &quot;no-extra-semi&quot;: 0,
          &quot;semi&quot;: 0,
          &quot;no-fallthrough&quot;: 0,
          &quot;no-empty&quot;: 0,
          &quot;no-mixed-spaces-and-tabs&quot;: 0,
          &quot;no-redeclare&quot;: 0,
          &quot;no-this-before-super&quot;: 1,
          &quot;no-unreachable&quot;: 1,
          &quot;no-use-before-define&quot;: 0,
          &quot;constructor-super&quot;: 1,
          &quot;curly&quot;: 0,
          &quot;eqeqeq&quot;: 0,
          &quot;func-names&quot;: 0,
          &quot;valid-typeof&quot;: 1,
          &quot;import/extensions&quot;: 0,
          &quot;react/jsx-filename-extension&quot;: 0,
          // note you must disable the base rule as it can report incorrect errors
          &quot;no-shadow&quot;: 0,
          &quot;@typescript-eslint/no-shadow&quot;: [
              1
          ],
          &quot;no-unused-vars&quot;: 0,
          &quot;@typescript-eslint/no-unused-vars&quot;: 1,
          &quot;no-undef&quot;: 0,
          &quot;jsx-a11y/click-events-have-key-events&quot;: 0,
          &quot;jsx-a11y/no-static-element-interactions&quot;: 0,
          &quot;@typescript-eslint/explicit-module-boundary-types&quot;: 0,
          &quot;react/button-has-type&quot;: 0,
          &quot;react/require-default-props&quot;: 0,
          &quot;react/prop-types&quot;: 0,
          &quot;react-hooks/exhaustive-deps&quot;: 0,
          &quot;react/jsx-props-no-spreading&quot;: 0
      },
      &quot;settings&quot;: {
          &quot;import/resolver&quot;: {
              &quot;node&quot;: {
                  &quot;extensions&quot;: [
                      &quot;.js&quot;,
                      &quot;.jsx&quot;,
                      &quot;.ts&quot;,
                      &quot;.tsx&quot;
                  ]
              }
          }
      }
  }
  </code></pre>
  <p>In a file <code>src/components/elements/ProtectedRoutes/InviteRoute.tsx</code>, I have:</p>
  <pre><code>import routeNames from 'constants/routeNames';
  import useRoles from 'hooks/roles';
  import { ROLE } from 'shared/src/types/enums';
  </code></pre>
  <p>The app runs fine, but when I run lint, I get errors:</p>
  <pre><code>  2:24  error  Unable to resolve path to module 'constants/routeNames'    import/no-unresolved
    3:22  error  Unable to resolve path to module 'hooks/roles'             import/no-unresolved
    5:22  error  Unable to resolve path to module 'shared/src/types/enums'  import/no-unresolved
  </code></pre>
  <p>What am I doing wrong?</p>