Is circular type reference a bad thing to do In TypeScript?

Question

I encountered below code snippets which contain a cyclic importing dependency on type reference.

// Foo.ts
import { Bar } from './Bar';
export interface Foo {
  isBarOK: (bar: Bar) => boolean;
}

// Bar.ts
import { Foo } form './Foo';
export class Bar {
  protected readonly foo: Foo;
}

This is a simplified version but it explains the case I encountered. tsc has no problem in compiling the code, but I got a warning from the import/no-cycle ESLint rule. We can see that Foo and Bar references each other for typing. Is this a bad practice? What impacts does it imply?

Answer 1

pure typescript file will not be outputted into your bundle, so you can safely ignore it.

but be careful with javascript file, circular import might mess up tree shaking