Add quick fix to export unexported members to fix unresolved symbol errors

Search Terms

import
export
unexported
symbols
auto import
completion
global
globals
intellisense

Suggestion

tsserver can auto-complete exported symbols from other modules, and add an import statement that imports the symbol you selected.

It should also suggest global symbols from other modules that are not exported, and add the export keyword if the suggestion is selected.

Use Cases

When I write a module I can't predict every use case of it, and I only export the global symbols that I think other modules would need to use. But when I'm working on a different module and I realize I want to use a symbol which is not exported by the other module (or maybe I don't even remember if it is or isn't exported), I would like my editor to export and import it for me instead of me having to find that symbol manually (because even go-to definition won't work) and export it, and then go back and auto-complete to auto-import.

This is also very very very useful when converting a web project to use imports. You can just go over all of the "undeclared symbol" errors and auto-complete to export and import the correct symbol.

Examples

module.ts:

function foo(name = 'World') {
  console.log('Hello ' + name);
}

export function bar() {
  foo();
}

app.ts:

import { bar } from './module.ts';

bar();

I now want to customize the "hello" message, so I start typing foo and then wait for completion suggestions which include the function foo from module.ts.

After selecting that, the symbol foo is automatically exported and imported for me, and I can use it immediately:

module.ts:

export function foo(name = 'World') {
  console.log('Hello ' + name);
}

export function bar() {
  foo();
}

app.ts:

import { bar, foo } from './module.ts';

bar();
foo('TypeScript');

Checklist

My suggestion meets these guidelines:

• This wouldn't be a breaking change in existing TypeScript/JavaScript code
• This wouldn't change the runtime behavior of existing JavaScript code
• This could be implemented without emitting different JS based on the types of the expressions
• This isn't a runtime feature (e.g. library functionality, non-ECMAScript syntax with JavaScript output, etc.)
• This feature would agree with the rest of TypeScript's Design Goals.

この issue では、tsserver の既存の自動インポートと補完の動作について説明しています。まず、エクスポートされたシンボルをどのように識別しているかを追跡してください。補完でエクスポートされていないグローバルシンボルを提示でき、選択時に定義元のモジュールへ export を追加し、インポート元のモジュールへ import を追加しつつ、既存の動作が維持されれば完了です。