VSCode Intellisense TypeScript: Exclude path that is referenced in paths

Question

I work on an Angular application, with some of the code grouped into their own (npm) projects so they can be referenced by other applications.

When I write code within the app folder, VSCode's Intellisense suggests the following paths for auto-imports, both of which work:

import 'FooComponent' from module "../../../projects/company/shared/src/foo/foo.component";
import 'FooComponent' from module "@company/shared";

My goal is to make the "@company/shared" import the default choice. It would be even better if the relative path could be hidden completely. I have tried this so far:

1. typescript.preferences.importModuleSpecifier: non-relative
2. typescript.preferences.importModuleSpecifierEnding: minimal
3. Excluding the directory in tsconfig.json after specifying the paths.

So far, these have not solved my problem.

I have an Angular project structure similar to this:

ApplicationName
  - dist
  - e2e
  - node_modules
  - projects
    - company
      - domain
      - shared
  - src
    - app
  tsconfig.json

Within tsconfig.json, I reference the shared project in the paths:

{ 
  "compilerOptions": {
    // standard stuff
    "baseUrl": "src",
    "paths": {
      @company/domain: [
        ../projects/company/domain/src/public-api
      ],
      @company/shared: [
        ../projects/company/shared/src/public-api
      ]
    },
    "exclude": [
      "./dist/**,",
      "**/projects/company"
    ]
}

Is there a way to hide the long "../../../projects/company/shared/src/foo/foo.component" import suggestion? It hogs the default and adds noise when there are multiple autocomplete-suggestions for foo.

Luxate

Answer 1

Adding

"typescript.preferences.importModuleSpecifier": "project-relative"

to settings.json in vscode worked for me.

I had to restart the TS Server for it to show up. (Command Palette --> Typescript: Restart TS Server.)

Now the default import suggestion is @company/packageName, which is what I wanted.

Predilection

Answer 2

In my case, I had to remove all the typescript import extension (auto import, typescript hero, typescript importer), then changing my : typescript.preferences.importModuleSpecifier from relative to project-relative.

Calycle

Yes! Thank you! I removed the TypeScript Importer extension and now everything works as expected. – Lecher