title: Module Resolution in TypeScript using Globbing Pattern with multiple wildcards
body: <p>I'm working on an Angular project with the following folder structure (hypothetical):</p>
  
  <pre><code>src
  └── app
      ├── component1
      │   └── component1.component.ts
      └── component2
          └── component2.component.ts
  tsconfig.json
  </code></pre>
  
  <p>In my <code>tsconfig.json</code> I'm trying to define a path with globbing patterns in a way that importing from <code>@components/component1</code> would resolve to <code>src/app/component1/component1.component</code>.</p>
  
  <p>This is my <code>tsconfig.json</code>:</p>
  
  <pre><code>OTHER STUFF...
  
  "baseUrl": "src",
  "paths": {
    "@components/*": ["app/*/*.component"]
  }
  </code></pre>
  
  <p>With this in place, I have the following import in some module/service/etc.:</p>
  
  <p><code>import { Component1 } from '@components/component1';</code></p>
  
  <p>The error I'm getting at compile time is:</p>
  
  <pre><code>ERROR in error TS5062: Substitution 'app/*/*.component' in pattern '@components/*' in can have at most one '*' character.
  </code></pre>
  
  <p>How can I achieve this without causing errors in the TypeScript compiler? What would be the proper way to write the globbing pattern in <code>tsconfig.json</code>?</p>
  
  <p>Any help is appreciated.</p>
  
  <h3>Note</h3>
  
  <p>I don't want to do <code>@components/component1/component1</code>.</p>