React TypeScript合并enum报错Cannot access enum before initialization如何解决？

这个错误既不是TypeScript Bug，也不是tsconfig配置缺失，是循环引入导致的模块初始化顺序异常：
你提到需要在firstFile.ts中使用secondFile.ts导出的Both，说明两个文件是双向依赖关系。ES 模块加载时遇到循环依赖，会先返回未完成的导出对象，此时如果在模块顶层同步访问未初始化完成的导出值，就会抛出该错误。
你的加载流程实际是：

1. 优先加载firstFile.ts，执行到导入Both的语句时，转去加载secondFile.ts
2. secondFile.ts导入firstFile.ts的One、Two，此时firstFile.ts还没执行到枚举定义的逻辑，secondFile.ts初始化Both时如果依赖未定义的值，或者firstFile.ts在模块顶层同步访问还没初始化完成的Both，都会触发报错。

• 方案1：拆分公共文件切断循环依赖（最推荐）
  把所有枚举定义和合并后的Both都抽离到独立的第三方公共文件，firstFile.ts和其他业务文件都从公共文件引入需要的枚举，完全避免双向引用。
  示例代码：

  // src/enums/common.ts
  export enum One {
      A,
      B,
  }
  export enum Two {
      C = 2,
      D,
  }
  export const Both = {
      ...One,
      ...Two
  } as const
  export type BothType = typeof Both[keyof typeof Both]
  

  之后firstFile.ts如果要使用Both，直接从common.ts引入即可，不存在循环依赖。
• 方案2：延迟访问Both
  如果不想调整文件结构，不要在firstFile.ts的顶层同步代码中直接访问Both，把访问逻辑放到函数、组件生命周期等运行时才会触发的逻辑中，此时所有模块已经初始化完成，Both已经完成赋值。
  错误写法：

  // firstFile.ts
  import { Both } from './secondFile'
  // 顶层直接访问，触发初始化顺序错误
  const currentVal = Both.A
  

  正确写法：

  // firstFile.ts
  import { Both } from './secondFile'
  export function getEnumVal() {
      // 函数调用时模块已初始化完成，不会报错
      return Both.A
  }
  

• 方案3：仅类型层面合并
  如果你只需要合并枚举的类型、不需要运行时的合并对象，可以直接用类型运算合并，不需要额外定义对象：

  export type Both = One | Two
  

内容的提问来源于stack exchange，提问作者dogefromage