es6模块循环依赖卡在实例化阶段而非解析阶段，因模块图闭环导致绑定失败、export为undefined，唯一解法是重构抽离共用模块或接口解耦。
模块循环依赖时 import 会卡在解析阶段
ES 模块的循环依赖不是运行时报错，而是卡在「模块实例化」前——浏览器加载完所有模块代码后，会构建模块图并尝试静态解析依赖链。一旦发现 A → B → A 这类闭环，import语句就无法完成绑定，控制台通常只显示 Uncaught SyntaxError: Cannot resolve module 或静默失败（Network 面板里模块请求已完成，但没执行），根本等不到 export 被求值。
- 这是静态分析阶段的问题，和 CommonJS 的“执行时才报错”完全不同
- 即使两个模块都用了
export default，只要路径形成闭环，模块图就无法建立 -
import()动态导入也无法绕过——它同样依赖模块图，循环存在时 Promise 永远 pending
顶层 export 值在循环中是 undefined 而非报错
如果模块 A 导出一个变量，模块 B 在 import 后立即访问它，而 B 又被 A import，那么 B 中读到的该变量值是 undefined，而不是抛异常。这是因为 ES 模块采用“先实例化、后求值”两阶段机制：所有模块先分配内存空间（此时 export 绑定已建立但未赋值），再按拓扑序执行顶层代码。循环打断了求值顺序，导致部分 export 保持初始值。
- 例如
export const config = { ready: false }在循环依赖模块中可能始终为{ ready: false }，哪怕另一端已改写 - 函数声明会被提升，但箭头函数或
const fn = () => {}不会——它们属于“求值阶段”，在循环中可能根本没执行 - 不要在循环模块里依赖
export的运行时状态，它不可靠
如何快速确认是不是循环依赖导致白屏或无反应
别急着改代码，先用浏览器 DevTools 快速验证：
- 打开
Network面板，过滤JS，看所有type="module"脚本是否都返回200且 size 正常——如果某个模块请求成功但没触发Console输出，大概率卡在实例化 - 在
Console里手动执行import('./a.js')，观察 Promise 状态：pending 超过 5 秒基本可判定循环 - 检查
Performance面板的Event Log，找ModuleEvaluation条目是否中断在某一步 - 临时删掉一个
import语句，如果页面恢复渲染，基本坐实循环
真正有效的解法只有两种，没有第三条路
网上说的“加 async”“换 import()”“用 window 全局共享”全都不解决本质问题。ES 模块规范不支持运行时打破循环，必须从结构上切断。
- 重构：把共用逻辑抽到第三个模块 C，A 和 B 都 import C，不再互相 import
- 接口解耦：用
export interface（TS）或纯类型定义文件声明契约，实际实现延迟到非循环链路上注入 - 绝对不要在模块顶层做跨模块状态初始化（比如
init()调用），放到DOMContentLoaded后统一触发
循环依赖不是加载慢，是模块图构建失败。修复的关键不在语法糖，而在依赖方向——只要路径里出现回边，浏览器就拒绝执行后续步骤。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
