Internal: Change type import styles #3725
Open
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Summary
This PR enables the following ESLint rules:
prefer-inline
optioninline-type-imports
optionTL;DR is that
type
keyword is now required for type importsWhy?
The benefits include:
Deep Dive
How to import a named export type?
BAD
BAD because we prefer inline type specifiers
import { type A, type B }
over top-level type specifierimport type { A, B }
.GOOD
How to import the default export type?
If we are just importing the default export type, we can either use inline type specifier
or the top-level type specifier, which is more concise:
How to import the default export type AND a name import type?
When we import both the default export type AND a named import, we can only use the inline type specifiers like this in order to write it in one import statement:
Don't: duplicated import statements
BAD
BAD
BAD
GOOD
How to import the type of an instance of a class
Suppose we have
MyClass.ts
The default export
MyClass
is also the type of its instance:How to import a value solely for its type
Suppose we have
Foo.tsx
And we want to import the types for
MY_CONST
andFoo
:Tip
Why do we use
type
import even thoughFoo
andMY_CONST
are not actually types?This is because we are only calling
typeof
on these values and TypeScript knows that these imports are only necessary for type checking.If value is imported, derive type from it instead of adding type imports
Note that
MyClass
,Foo
, andMY_CONST
are imported for type checking AND runtime. In such case, type imports would be redundant since we can just derive the types from the values.