Typescript: Should I explicitly separate "import" and "import type" statements?

[parzhitsky]

^{_A.S.: This is an opinion-based question, I cannot ask such on StackOverflow_}

I've been using the import type statement for a while now, and I wonder, what was the intended use-case for it:

• Is it a separate TypeScript-exclusive fully-fledged feature, i.e. "import for types"? Or
• is it an extension to regular import, designed to be used in the case when only type information is actually used, i.e. fallback?

I always thought of import type as "import for types", the first option, so the code always looked like this:

  import type { Type } from "some-module";
+ import { value } from "some-module";

… but auto-import in VSCode suggests it is actually the second, fallback-ish:

- import type { Type } from "some-module";
+ import { Type, value } from "some-module";

Now, I understand that both will work correctly, and it is basically a matter of stylistic choice for the team, but the authors' original intention is important for me, and I'm a sole developer in this case

[iraj465]

Ideally one goes for -
import { Type, value } from "some-module";
import type { Type } from "some-module"; for solving specific transcompiler issue like Babel js.
How the error is reproduced:
Transcompilers like Babel JS removes the types whilst transpiling,but it may happen sometimes that whilst transpiling it isn't sure whether a specific import is simply a type (that can be removed ) or an actual value(that is to be kept)
For example:
import { Type } from "./types"; const changeType = (val : Type) => { //some logic }; is transpiled to
const changeColor = (color) => { window.color = color; }; simply by removing the type.
But removing types simply isn't so obvious in this case:
import { Type } from "./types"; export { Type };
Hence, we need to explicity define these type imports as import type {Type} .
Otherwise,you should use the generic import {Type}

[andrewbranch]

The intention is for you not to use import type unless you need to. There’s some discussion related to auto-import at https://github.com/microsoft/TypeScript/issues/39432, and there’s a thorough description of the motivations for introducing the feature on the original PR: https://github.com/microsoft/TypeScript/pull/35200.

If you don’t have a specific need for type-only imports, you could consider them a stylistic choice. My personal suggestion for how to consider that stylistic choice is

• Best style: do not use import type. This style choice eliminates meaningless distinctions and reduces cognitive load, giving you more time and resources to think about things that matter.
• Second-best style: enable "importsNotUsedAsValues": "error" in your tsconfig, then use import type only where the errors force you to.
• Worst style: use import type as much as possible, separating values and types from the same module into separate import statements. There is simply no reason to do this, and since there are currently no tools that would enforce this style, it would fall on you to analyze and separate your declarations manually, wasting your valuable coding time.

[parzhitsky]

Thanks, @andrewbranch, great to hear the author's intent first-hand 👍

I'd argue that the second presented option is actually the best one; import type, I think, is a useful feature, consistently avoiding using it would be kind of silly. That's up to debate though.