Multiple issues with import quick fixes and project references

[niba]

TypeScript Version: 3.3.3 or 3.4.0-dev.20190311

Search Terms: quick fix, import, project references, path aliases

Code: I use project-references-demo

---

Problem 1 Import quick fix doesn't appear. Modification to the original code Removed makeRandomName import from dog.ts file. Added lastElementOf dummy function to core/utilites.ts. Description In the project animals I would like to use vscode and quick fix to add import for makeRandomName from project core. Vscode doesn't suggest anything.

To fix the problem I need to import once (it can be anywhere in my project) from the file that contains makeRandomName. For example if I add import { lastElementOf } from "../core/utilities"; to animal.ts it will solve my problem. After that in dog.ts I get a suggestion to Import makeRandomName from module "../lib/core/utilities".

Expected behavior: I expect to immediately get import suggestions.

---

Problem 2 Import quick fix suggests wrong paths in a project with path aliases Modification to the original code In zoo project I added the following entries to the tsconfig

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

Description When I want to reference something from the project itself I get suggestions from quick fix to use @app/{projectPath} and it's correct.

The problem is with imports to the animals project. If I use something from animals I don't get any suggestions. To get them I need to have somewhere inside my zoo project already defined at least one import from animals project. Now the suggestions show wrong paths. Vscode tells me to use the imports that point to my outDir folder which is lib, example: import { createDog } from '@app/../../lib/animals'; or import { createDog } from '../../lib/animals'; Correct suggestions (code compiles with them): import { createDog } from '@animals/index' import { createDog } from '../../animals

So here are three problems.

1. To get any suggestions you need to have defined at least one import. Maybe it doesn't detect references entry from tsconfig?
2. It doesn't suggest to use @animals path alias
3. It points to outDir folder, not to the animals project folder.

[lucasbasquerotto]

Any news on this? I have a common directory for files that are used by react and react-native in other 2 directories (both use typescript), and I'm able to import them automatically only in the common directory, if I try to import something present in the common directory in one of the 2 other directories, it will only work if it was already imported, otherwise it won't auto-import, not even show a suggestion.

Also, if I try to find the references of something in the common directory, it will only find the references in that directory, even if there are places calling it in the react and react-native directories (I can only see those dependencies if I try to find them in some place it's already being used in one of those 2 directories).

For example, in my tsconfig.json in the react directory, I have:

  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "@/lang/*": [
        "./lang/*"
      ],
      "@/lib/*": [
        "../common/lib/*"
      ]
    },
  ...

Typescript correctly sees the dependencies at @/lib/*, but doesn't autoimport them if the dependency is not being referenced anywhere.

Any suggestions about how can I proceed?

Update

I was able to make it work by placing a link in react/lib pointing to common/lib and changing tsconfig.json to:

  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "@/lang/*": [
        "./lang/*"
      ],
      "@/lib/*": [
        "./lib/*"
      ]
    },
  ...

This solved both the problems from auto-imports (this issue), as well as when trying to find references from dependencies in the common directory being used in the react directory (before, only the references in the common directory were shown).