Repository: TypeScript
Issue: refactor import statements to import more specific paths
Labels: Suggestion,Awaiting More Feedback,Domain: Refactorings

<!-- ⚠️⚠️ Do Not Delete This! feature_request_template ⚠️⚠️ -->
<!-- Please read our Rules of Conduct: https://opensource.microsoft.com/codeofconduct/ -->
<!-- Please search existing issues to avoid creating duplicates. -->

<!-- Describe the feature you'd like. -->

It would be great to have the ability to refactor an import so that it will import from a more specific path rather than an index. For example, given this code,

```ts
import {Box} from 'three'
```

a refactor option would let us make it more specific so that it imports `Box` directly from where it comes from (within certain limitations, f.e. only if the `package.json` `exports` field allows it):

```ts
import {Box3} from 'three/src/math/Box3.js'
```

This makes avoiding importing from index files easier, which is useful for avoiding to import a bunch of code that is not actually needed, especially in native environments with native ES modules (no tree shaking). Even so, build tools don't always tree shake, and if they do they can get it wrong, and build tools all tree shake in different ways requiring different conventions to be followed.

At the very least, it would be awesome to have a refactor option that is good for the common case: import as little as possible first (including build-less native ESM setups), _then_ optimize.

## practical use case:

Consider the import statement at the top of this file inside the `three` library that imports `from 'three'`:

https://github.com/mrdoob/three.js/blob/r139/examples/jsm/controls/OrbitControls.js

A common case (that I've seen people do in various projects across different companies in my career) is to copy this file into a local project and modify as needed.

One such modification is to convert the import statements from this,

```js
import {
	EventDispatcher,
	MOUSE,
	Quaternion,
	// ...
} from 'three';
```

to this:

```js
import {EventDispatcher} from 'three/src/core/EventDispatcher.js'
import {MOUSE} from 'three/src/constants.js'
import {Quaternion} from 'three/src/math/Quaternion.js'
// ...
```

in order to avoid bundling the _**entire whole**_ `three` library.

This is of course doable by hand.

This one gets a little more time consuming:

https://github.com/mrdoob/three.js/blob/r139/examples/jsm/loaders/GLTFLoader.js

## solution suggestion

A simple refactor option like `Make all imports specific` would be awesome.

It would also be awesome to configure in VS Code settings to always auto complete most specific path when auto importing during an auto complete. F.e. typing `Quatern` then hitting tab would insert an import statement that import `from 'three/src/math/Quaternion.js'` instead of `from 'three'`.

## considerations

- When using node module resultion, if specific paths are not allowed by `package.json` `exports` field, then don't perform the refactor. This should operate only within the rules of module visibility.
- If not using node module resolution (f.e. only file paths) then it would be fine to expand import paths to any local file (this might include `./node_modules` paths for some projects that have that folder).
- other similar considerations...

## Status quo

Currently VS Code auto completes import statements using the simplest import paths, which makes people's applications bloated by default.