type-only imports conflict with no-duplicate-imports eslint rule

Question

I have a PropsTypes.ts file like this:

export interface ImageSrc { url: string; originUrl: string }

export default interface PropsType {
  images: Array<ImageSrc> | Array<string>;
  visible: boolean;
  activeIndex?: number;
  showPagination?: boolean;
  maxScale?: number;
  minScale?: number;
  onChange?: Function;
  onClose?: Function;
}

I am using type-only-imports-and-export feature of TypeScript 3.8.

import type PropsType from './PropsType';
import type { ImageSrc } from './PropsType';

But eslint will throw an error:

'./PropsType' imported multiple times. eslint(import/no-duplicates)

I expected eslint should satisfy this rule for type-only imports and export. Is there a way to satisfy this eslint rule without disabling it?

Answer 1

You can use like this import both PropsType and PropsType

import type { PropsType , ImageSrc } from './PropsType';

Answer 2

Use @typescript-eslint/no-duplicate-imports rule from typescript-eslint plugin: https://typescript-eslint.io/rules/no-duplicate-imports/