Visual Studio Code can't resolve angular's tsconfig paths
I figured it out, even if I'm keep thinking that is all absurd...
VsCode automatically looks for a tsconfig.json
file and it doesn't care about tsconfig.app.json
, so paths
needs to be specified in tsconfig.json
.
At the same time, the angular-cli scaffolding specify a baseUrl
parameter in tsconfig.app.json
which overrides the upper one.
The solution is to delete baseUrl
parameter in the tsconfig.app.json
or edit its value to "../"
(As a personal remark, given that vscode is largely used to build angular solutions, I think that there's something that should be revisited in the angular-cli scaffolding or in how vscode looks for tsconfig files)
In case you work with project Angular, let place baseUrl
and paths
in tsconfig.json
instead of tsconfig.app.json
.
It seems VSCode only checks the tsconfig.json
directly in the folder your open. It does not check folders above like tsc and does not look at tsconfig.app.json
. So in some cases the baseUrl
might be missing because VSCode simply has not read a tsconfig.json
.
VSCode's limitation to a single tsconfig.json
in a fixed place has been around for a while and it seems it's not so easy to make this more flexible:
https://github.com/microsoft/vscode/issues/12463
(scroll to end)
As mentioned above this is annoying in Angular-CLI scaffolding with multiple sub-projects where there is only one tsconfig.json
at the root of the workspace. Obviously the projects might have different baseUrls
in their tsconfig.app.json
which cannot all go in a single tsconfig.json
at the root.
As a workaround I have in addition to the project specific baseUrl
in tsconfig.app.json
created an extra minimal tsconfig.json
for VSCode in the src folder of a sub-project with "baseUrl":"."
and open VSCode from there. I have not tested this severely but so far Angular compiling and VSCode intellisense both seem to be happy.