How to make TS more intelligent?

#help #typescript

I have a monorepo like this:

root/packages
  |-lib1
  |-lib2
  |-lib3

lib3 depends of both lib1 and lib2. I'm using TS v3.7.2 with composite (true), baseUrl, paths and references props to be able to work with the new ts project references.

Everything is ok except for one thing: I'm using VSCode, I'm writing something for lib3 and using an enum from lib1, but the enum is still not imported. When I ask VSCode to show me the possible imports for the enum, it doesn't show anything, but if I write the import by hand, it recognize it.

E.g:

file in lib3 where VSCode doesn't know where to import from

export function bla(key: EnumFromLib1) {
  // do something
}

file in lib3 where VSCode know

import {} from 'lib1/some/path/to/file';

export function bla(key: EnumFromLib1) {
  // do something
}

In the second example, if I press the keyboard shorcut for importing EnumFromLib1 it will list the possibility from the lib1/some/path/to/file file.

So, the question is: How can I configure TS to help him know beforehand that I have more elements in those files?

Thank you!

Top comments (4)

Dharmen Shah • Dec 13 '19 • Edited

I am not sure how to fix that, but for me it's working fine. See attached image.

Luciano Graziani • Dec 13 '19

Yep, that works for me too. What I was trying to say is that 3rd party libs (inside node_modules) are not cached or read eagerly, and until you don't import something from the library, you won't have intellisense for that.

I wanted to know if it was possible to tell vscode to load eagerly some libs (we have a few private packages we use in our apps).

Dharmen Shah • Dec 14 '19

The reason for not loading node modules eagerly:

#

RyanCavanaugh commented on Feb 27, 2019

This is an intentional performance/helpfulness trade-off.

We don't eagerly consume all .d.ts files from node_modules - doing so would be prohibitively expensive in a world where there are regularly possible thousands of definition files in node_modules.

When the Angular .d.ts file isn't consumed, we have no way of knowing that NgModule happens to come from @angular/core, thus can't suggest that auto-import.

View on GitHub

Although, you can achieve it using the way mentioned here:

Auto complete not working for packages except those under @types folder #30474

EnixCoda commented on Jan 19, 2019

VSCode Version: 1.30.2
OS Version: macOS v10.13.6

Auto complete is one of my favorite features of VS code. But sometimes it doesn't provide what I need.

Steps to Reproduce:

Create a project with create-react-app: npx create-react-app test-auto-complete --typescript
Create a empty file src/test.tsx.
Make sure auto complete works: type isvalid and get following suggestions Then confirm:
Install a typed package from npm. (I made one - safe-touch
See if auto complete works for the package(type safe and expect suggestion of safeTouch): Negative :(
There is a difference between the types file of safe-touch and react. Safe-touch's is directly under node_modules while react's is under node_modules/@types/. Then I tried to make a folder under @types for the package, simply cp -r node_modules/safe-touch node_modules/@types.
See if auto complete works now: It works! 🎉🎉