1 min read


Circular imports between two files are not allowed.
Table of Contents

Conformance is available on Enterprise plans

This check ensures that there is no path through import statements back to the original file. This helps to keep dependencies between files clean, which aids in dependency analysis and refactoring.

import Badge from './component-b';
export function withHigherOrderComponent({ children }) {
  return <div>{children}</div>;
export function Page() {
  return (
      <Badge />
import { withHigherOrderComponent } from './component-a';
function Badge() {
  return <div>Badge</div>;
export default withHigherOrderComponent(Badge);

The exports in the file that has a circular import should be refactored so that the circular import doesn't exist anymore. This might be fixed by moving some of the exports in a file to a separate file so that the imports don't cause a circular import. In some cases, it may be necessary to refactor the code to avoid the circular import.

Last updated on July 25, 2024