consistent-type-specifier-style.md

import-x/consistent-type-specifier-style

🔧 This rule is automatically fixable by the --fix CLI option.

In both Flow and TypeScript you can mark an import as a type-only import by adding a "kind" marker to the import. Both languages support two positions for marker.

At the top-level which marks all names in the import as type-only and applies to named, default, and namespace (for TypeScript) specifiers:

import type Foo from 'Foo';
import type {Bar} from 'Bar';
// ts only
import type * as Bam from 'Bam';
// flow only
import typeof Baz from 'Baz';

Inline with to the named import, which marks just the specific name in the import as type-only. An inline specifier is only valid for named specifiers, and not for default or namespace specifiers:

import {type Foo} from 'Foo';
// flow only
import {typeof Bar} from 'Bar';

Rule Details

This rule either enforces or bans the use of inline type-only markers for named imports.

This rule includes a fixer that will automatically convert your specifiers to the correct form - however the fixer will not respect your preferences around de-duplicating imports. If this is important to you, consider using the import-x/no-duplicates rule.

Options

The rule accepts a single string option which may be one of:

• 'prefer-inline' - enforces that named type-only specifiers are only ever written with an inline marker; and never as part of a top-level, type-only import.
• 'prefer-top-level' - enforces that named type-only specifiers only ever written as part of a top-level, type-only import; and never with an inline marker.

By default the rule will use the prefer-inline option.

Examples

prefer-top-level

❌ Invalid with ["error", "prefer-top-level"]

import {type Foo} from 'Foo';
import Foo, {type Bar} from 'Foo';
// flow only
import {typeof Foo} from 'Foo';

✅ Valid with ["error", "prefer-top-level"]

import type {Foo} from 'Foo';
import type Foo, {Bar} from 'Foo';
// flow only
import typeof {Foo} from 'Foo';

prefer-inline

❌ Invalid with ["error", "prefer-inline"]

import type {Foo} from 'Foo';
import type Foo, {Bar} from 'Foo';
// flow only
import typeof {Foo} from 'Foo';

✅ Valid with ["error", "prefer-inline"]

import {type Foo} from 'Foo';
import Foo, {type Bar} from 'Foo';
// flow only
import {typeof Foo} from 'Foo';

When Not To Use It

If you aren't using Flow or TypeScript 4.5+, then this rule does not apply and need not be used.

If you don't care about, and don't want to standardize how named specifiers are imported then you should not use this rule.