Angular12升级至13后大型ngrx createEffect异常问题排查

核心问题原因 #

• RxJS版本差异触发的校验严格化：Angular 13绑定RxJS 7.x，相比Angular 12使用的RxJS 6.x，对操作符参数的校验更严苛。比如你提到的多参数filter，如果传入了不符合RxJS规范的参数（比如第三个非调度器参数），RxJS 7会直接抛出错误，而RxJS 6可能静默兼容。
• createEffect的默认行为变更：原@Effect()装饰器默认允许返回非Action流的宽松校验，而createEffect默认要求返回的Observable必须是符合规范的Action（带type属性）。如果你的Effect流中存在不符合要求的输出，框架会拦截报错，加{ dispatch: false }相当于跳过了Action校验，所以能临时运行，但原有逻辑自然失效。
• 大型Effect的链式操作隐错：复杂的链式调用（多filter/tap串联）中，可能存在隐式的类型不匹配、异步副作用泄漏，或者未处理的错误流。这些问题在旧版本中被掩盖，升级后RxJS 7和Angular 13的严格校验把它们暴露了出来。

关键限制点 #

• RxJS操作符参数规范：RxJS 7中，filter仅接受两个参数：断言函数（返回布尔值）和可选的调度器。任何额外参数都会触发错误；tap的回调函数也不允许返回非void类型，否则会干扰流的完整性。
• createEffect的Action强制校验：默认配置下，createEffect要求返回的Observable必须是Action类型。如果你的Effect在tap中执行了异步操作但未正确处理，或者filter后输出的流不符合Action结构，就会触发框架错误。
• 错误流的严格处理：Angular 13的Effects模块会监听Effect流的所有错误，一旦出现未捕获的错误，整个Effect会被终止。而旧版本中这类错误可能不会导致Effect完全失效。

修复建议 #

• 排查操作符用法：逐个检查所有filter/tap的参数，比如把多参数filter的额外逻辑移到tap或map中，确保filter只保留断言函数。
• 显式约束Action类型：用ofType限定输入Action的类型，用map返回明确的Action对象，给createEffect指定泛型类型，避免类型不匹配。
• 添加错误捕获：在大型Effect的链式调用末尾加上catchError，捕获并处理流中的错误，比如返回空Action或重新触发流，防止Effect崩溃。
• 拆分复杂Effect：把大型Effect拆分成多个职责单一的小Effect，降低调试复杂度，也更容易定位问题点。

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