title: Angular 11 tsconfig Path Aliases not Recognized
body: <p>I am working with Angular 11 and trying to use short imports like <code>import {smthg} from '@common'</code> instead of <code>import {smthg} from '../../../common'</code></p>
  <p>But I always get errors in IDEA: <code>TS2307: Cannot find module '@common' or its corresponding type declarations.</code></p>
  <p>And same error in console when trying to compile .ts files (<code>ng serve</code>)</p>
  <p>Interestingly, when I add <code>/index</code> to the import, then IDEA stops cursing, but the error does not disappear in the console</p>
  <pre><code>myAngularProject
  │   package.json
  │   tsconfig.json
  │   tsconfig.app.json
  │   angular.json    
  │
  └───src
      │   main.ts
      │   index.html
      │
      └───app
          │  
          └───common
          │
          └───features
  </code></pre>
  <p>tsconfig.json:</p>
  <pre><code>/* To learn more about this file see: https://angular.io/config/tsconfig. */
  {
    &quot;compileOnSave&quot;: false,
    &quot;compilerOptions&quot;: {
      &quot;baseUrl&quot;: &quot;./src&quot;,
      &quot;paths&quot;: {
        &quot;@common/*&quot;: [&quot;app/common/*&quot;],
        &quot;@features/*&quot;: [&quot;app/features/*&quot;],
        &quot;@platform/*&quot;: [&quot;app/platform/*&quot;],
        &quot;@env&quot;: [&quot;environments/environment&quot;]
      },
      &quot;outDir&quot;: &quot;./dist/out-tsc&quot;,
      &quot;forceConsistentCasingInFileNames&quot;: true,
      &quot;strict&quot;: true,
      &quot;noImplicitReturns&quot;: true,
      &quot;noFallthroughCasesInSwitch&quot;: true,
      &quot;sourceMap&quot;: true,
      &quot;declaration&quot;: false,
      &quot;downlevelIteration&quot;: true,
      &quot;experimentalDecorators&quot;: true,
      &quot;moduleResolution&quot;: &quot;node&quot;,
      &quot;importHelpers&quot;: true,
      &quot;target&quot;: &quot;es2015&quot;,
      &quot;module&quot;: &quot;es2020&quot;,
      &quot;lib&quot;: [
        &quot;es2018&quot;,
        &quot;dom&quot;
      ]
    },
    &quot;angularCompilerOptions&quot;: {
      &quot;strictInjectionParameters&quot;: true,
      &quot;strictInputAccessModifiers&quot;: true,
      &quot;strictTemplates&quot;: true
    }
  }
  
  </code></pre>
  <p>tsconfig.app.json:</p>
  <pre><code>{
    &quot;extends&quot;: &quot;./tsconfig.json&quot;,
    &quot;compilerOptions&quot;: {
      &quot;outDir&quot;: &quot;./out-tsc/app&quot;,
      &quot;types&quot;: [&quot;node&quot;]
    },
    &quot;files&quot;: [
      &quot;src/main.ts&quot;,
      &quot;src/polyfills.ts&quot;
    ],
    &quot;include&quot;: [
      &quot;src/**/*.d.ts&quot;
    ]
  }
  </code></pre>
  <p>IDEA error:
  <a href="https://i.stack.imgur.com/WAalZ.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/WAalZ.png" alt="idea error" /></a></p>
  <p>console tsc error:
  <a href="https://i.stack.imgur.com/CFRNH.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/CFRNH.png" alt="enter image description here" /></a></p>
  <p>Versions:</p>
  <pre><code>Angular CLI: 11.0.7
  Node: 14.2.0
  OS: darwin x64
  
  Angular: 11.0.9
  ... animations, common, compiler, compiler-cli, core, forms
  ... platform-browser, platform-browser-dynamic, router
  Ivy Workspace: Yes
  
  Package                         Version
  ---------------------------------------------------------
  @angular-devkit/architect       0.1100.7
  @angular-devkit/build-angular   0.1100.7
  @angular-devkit/core            11.0.7
  @angular-devkit/schematics      11.0.7
  @angular/cli                    11.0.7
  @schematics/angular             11.0.7
  @schematics/update              0.1100.7
  rxjs                            6.6.3
  typescript                      4.0.5
  </code></pre>