Type definitions not exported correctly for vscode (intellisense not working on clean projects)

I tried searching everywhere for this issue but actually very few people noticed it (to my surprise). The only thing I could find is this stackoverlow question

🐞 bug report

Affected Package

The issue is caused by package @angular/....

Is this a regression?

I don’t think so, as far as I can recall IntelliSense on vscode never worked but it’s a very subtle issue (for this reason I’m not sure when this started or if it has always been like this). In fact, just a few people noticed this behavior because vscode seems to be smart enough to remember and understand after the first manual import

Description

Vscode has two ways to provide hints through IntelliSense to the developer (you can read it here):

It can either look for the node_modules/@types folder or get the type definition file in the package.json, under the “typings” or “types” key (the first way is more suited for non ts libraries/frameworks).

You enforce the first one through your cli when calling ng new my-app in tsconfig.json we find:

"typeRoots": [
  "node_modules/@types"
],

but in all the new angular projects generated by the cli, the @types folder is missing the angular types:

Relating this behavior to how React handles this, for example, isn’t ok. With React we correctly get suggestions and the type definitions file appear correctly in the @types folder:

So, knowing that maybe pointing typeRoots to the node_modules/@angular folder would solve the problem, an attempt I’ve done is to include it there. Problem solved partially, why? Because then all the routing stuff were importable, but still not the http stuff.

How come? Because vscode is looking at your package.json files available in the node_modules/@angular folder, with the router, everything’s ok:

but not with the common package.json:

since the common.d.ts file has no reference for many stuff like, for example, the httpclient module:

🔬 Minimal Reproduction

See yourself, open stackblitz with a blank project: https://stackblitz.com/fork/angular and write HttpC (press ctrl+space too that is usually the command to make the hints show up) and see that no correct suggestion is shown.

Anything else relevant?

I will put up a PR exporting all the needed definitions directly from the common.d.ts file and please, edit your cli to generate the tsconfig.json including node_modules/@angular

🌍 Your Environment

Angular Version:

Angular CLI: 9.0.1
Node: 12.13.1
OS: win32 x64

Angular: 9.0.0
... animations, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router
Ivy Workspace: Yes

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.900.1
@angular-devkit/build-angular     0.900.1
@angular-devkit/build-optimizer   0.900.1
@angular-devkit/build-webpack     0.900.1
@angular-devkit/core              9.0.1
@angular-devkit/schematics        9.0.1
@angular/cli                      9.0.1
@ngtools/webpack                  9.0.1
@schematics/angular               9.0.1
@schematics/update                0.900.1
rxjs                              6.5.4
typescript                        3.7.5
webpack                           4.41.2

[alan-agius4]

Closing as this should is fixed in TypeScript 4.0 which is supported in now supported in version 10.1.0-next.7.

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}