Auto imports break with exports in package.json when dependencies grow in Monorepo

[makezi]

🔎 Search Terms

"exports", "auto-import", "monorepo", "turborepo"

🕗 Version & Regression Information

The bug is present from all the versions of TypeScript I've tried ranging from v5.3.3 - v5.6.3

⏯ Playground Link

No response

💻 Code

🙁 Actual behavior

Within a monorepo (turborepo for instance), when you have an internal package with exports being consumed by an app that has a large list of dependencies then the auto-import suggestions don't seem to work anymore. I created the issue on turborepo which has more details about the issue.

Basically if you use the kitchen-sink example and import a component from the internal package then VSCode will suggest the import correctly:

This will break when the consuming app's dependencies grow (somewhere around a minimum of ~20 total dependencies)

This fixes itself if you were to remove some dependencies from the consuming app. You can also circumvent this by doing the right hand expression import of repo/ui/counter-button to get it to work again:

But upon workspace / tsserver restart it will tend to forget where the import is from as the dependencies grow / app grows larger. This issue persists in other IDEs besides VSCode such as Zed or Intellij Webstorm so it seems like its an issue with TypeScript itself.

To reproduce I have an example that uses said kitchen sink demo from Turborepo: https://github.com/makezi/turborepo-ts-exports-bug. I made sure to test in both VSCode and VSCode Insiders with no extensions.

1. pnpm dlx create-turbo@latest --example kitchen-sink
2. Go to storefront's package.json file and add more dependencies so that the total number of dependencies is in the ballpack of ~20 or so. You can add the following to quickly reproduce:

"@t3-oss/env-nextjs": "^0.7.1",
"@tanstack/react-query": "^5.18.1",
"@vercel/analytics": "^0.1.1",
"@vercel/edge-config": "^1.2.1",
"@vercel/speed-insights": "^1.0.3",
"axios": "^1.4.0",
"date-fns": "^2.30.0",
"humps": "^2.0.1"

3. Delete everything in page.tsx so that there isn't a reference to CounterButton existing and just paste the following:

export default function Page() {
  // Auto import doesn't work
  return <Counter
}

And to get it working again just remove a package from the dependency list:

1. Remove humps
2. pnpm i
3. Reload workspace / tsserver
4. Auto import should work again

Note that every time I add / remove a package I always reload the workspace / TSServer for a clean slate otherwise VSCode will remember the import previously.

Perhaps there is a config issue I'm missing?

🙂 Expected behavior

Auto import / suggestions to work for internal packages that expose code via exports within apps that have a large number of dependencies.

Additional information about the issue

No response

[jvandenaardweg]

Seeing the exact same behaviour and it's driving me nuts :)

I notice the auto import suggestion works fine when you already have a reference somewhere in a monorepo app (in your example ./apps/storefront). So it's probably cached then by TS and uses that reference. But for new ./packages/ui files, that are not used yet but are exported correctly, there's no auto import suggestion once your dependencies go past a certain uknown threshold.

edit:

Found a workaround (?), add this to ./vscode/settings.json:

{
  // your other settings

  // add this:
  "typescript.preferences.includePackageJsonAutoImports": "on"
}

Now it works fine for me.

It was suggested here: #58709 (comment)

The default value is auto and says: "Search dependencies based on estimated performance impact". So I think the extra dependencies add to that performance impact, and then VSCode just decides to figure it out yourself and just not suggest these ./packages/* imports anymore, unless you already used it somewhere in your code.

So setting typescript.preferences.includePackageJsonAutoImports to on might have a performance impact. But hey, that's what's expected, because we use more dependencies. Got lots of compute on my machine, so I guess the auto value just ignores that and uses an arbitrary limit.

[typescript-bot]

This issue has been marked as "Question" and has seen no recent activity. It has been automatically closed for house-keeping purposes.