Angular2, TypeScript and Visual Studio Code absolute path configuration

Question

As already explained to me in THIS question (thank you by the way), i can use TS configuration file to provide baseUrl and paths to be able to reduce nonsense paths like ../../../../someModule to way shorter, aliased versions like @AliasPath/someModule. So, I modified my tsconfig.app.json (please note, I modified .app.json config file, not main tsconfig.json in root folder) file with following line:

....
"baseUrl": "./",
....
"paths": {
  "@services/*" : ["app/services/*", "src/app/services/*"]
}

In code I try to import one service by:
import { CommunicationService } from "@services/communication.service";

Project is building fine, but TypeScript is unable to recognize my defined path aliases, marking them with red squiggle line:

And reporting missing files in problem tab:

The question is, how can I instruct TypeScript (because I assume it's TypeScript issue) about my paths aliases?

LUXS · Accepted Answer · 2018-10-07 17:34:12Z

1

This seems to be an issue with VS Code as you can see on the following link for example (it is one of many): VSCode ignores paths in tsconfig.app.json

But I have found a workaround for me, since I had the same problem. I just installed the extention TypeScript Importer. This solved it for me.

answered Oct 7, 2018 at 17:34

LUXS

3531 gold badge2 silver badges15 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Matt Bierner · Accepted Answer · 2018-10-08 00:53:46Z

1

As of TypeScript 3.1, the paths configuration must be in a file called tsconfig.json. It will not be picked up by vscode if it is in tsconfig.app.json (but tsc -p tsconfig.app.json will obviously work).

To make sure a TS file is part of the right tsconfig, run the TypeScript: Go to project configuration command in VS Code. This should open the tsconfig with paths set

answered Oct 8, 2018 at 0:53

Matt Bierner

67.3k24 gold badges199 silver badges233 bronze badges

1 Comment

LUXS Over a year ago

Unfortunately this didn't work for me in my angular project.

Collectives™ on Stack Overflow

Angular2, TypeScript and Visual Studio Code absolute path configuration

2 Answers 2

Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related