# @avalane/rxjs-spy 中文文档 规范地址：https://npmcn.com/package/%40avalane/rxjs-spy/ 版本：8\.0\.4 npm 元数据更新时间：2025-08-15T17:00:26.574Z 中文译文更新时间：2026-11-07T07:37:38.733Z 软件包许可：MIT 本文由上游 README 翻译，可能存在偏差，请结合原文核对 API、命令与配置。版权与许可归原作者所有。 原始 npm 页面：https://www.npmjs.com/package/%40avalane/rxjs-spy 原文对照：https://npmcn.com/package/%40avalane/rxjs-spy/?lang=original 项目主页：https://github.com/cartant/rxjs-spy 源码仓库：https://github.com/cartant/rxjs-spy ## 关键信息（来自 npm 元数据） - 包体积（解压后）：1 MB，73 个文件 - 模块格式：ESM + CJS - TypeScript 类型：包内自带 - 运行依赖：6 个 - peer 依赖：rxjs ^7\.0\.0 - 首次发布：2025-08-15T17:00:25.968Z - 最新版本发布：2025-08-15T17:00:26.305Z - 近 30 天下载量：4008（2026-10-07 至 2026-11-05，npm 官方下载统计） - 已发布版本数：1（近 12 个月 0 个） ## 中文简介 RxJS 调试库 ## 安装 ```sh npm install @avalane/rxjs-spy ``` 也可以使用：`pnpm add @avalane/rxjs-spy`、`yarn add @avalane/rxjs-spy`、`bun add @avalane/rxjs-spy` ## README # rxjs- spy (英语) [![GitHub License](https://img.shields.io/badge/license-MIT-blue.svg)](https://github.com/cartant/rxjs-spy/blob/master/LICENSE) [![NPM version](https://img.shields.io/npm/v/rxjs-spy.svg)](https://www.npmjs.com/package/rxjs-spy) [![Downloads](http://img.shields.io/npm/dm/rxjs-spy.svg)](https://npmjs.org/package/rxjs-spy) [![Build status](https://img.shields.io/travis/cartant/rxjs-spy.svg)](http://travis-ci.org/cartant/rxjs-spy) [![dependency status](https://img.shields.io/david/cartant/rxjs-spy.svg)](https://david-dm.org/cartant/rxjs-spy) [![devDependency Status](https://img.shields.io/david/dev/cartant/rxjs-spy.svg)](https://david-dm.org/cartant/rxjs-spy#info=devDependencies) [![peerDependency Status](https://img.shields.io/david/peer/cartant/rxjs-spy.svg)](https://david-dm.org/cartant/rxjs-spy#info=peerDependencies) [![Greenkeeper badge](https://badges.greenkeeper.io/cartant/rxjs-spy.svg)](https://greenkeeper.io/) ### 这是什么? `rxjs-spy` 是 RxJS 的调试库 . ### 你为什么需要它? 调试基于 RxJS 代码的常用方法涉及 sprinkling `do` 操作员和伐木者 整个由观察物组成的。 我认为这是很乏味的, 所以我写了这个图书馆, 并实施了一种无侵扰性的机制, 以识别可观测和伐木, 检查可观测的订阅. 如果你也在找一个不那么痛苦的 RxJS 调试经验,你可能会觉得这个库是有用的. Slack的工程师们收养了 `rxjs-spy` 并且已经 [这是说](https://slack.engineering/growing-pains-migrating-slacks-desktop-app-to-browserview-2759690d9c7b) 关于它: > 你可能会说,"\[.\] 但观察者不是无法调试的吗?" 你大概不到一年前就是对的 但这是 JavaScript 和 JavaScript, 唯一的 `const` 变化. `rxjs-spy` 使调试(即记录和可视化)流变得简单如添加 a `tag`。可以从控制台上监视、暂停和重放标记的流. 欲了解图书馆如何运作及能做些什么,请查看: - [调试 RxJS 第 1 部分: 工具](https://ncjamieson.com/debugging-rxjs-part-1-tooling/)。 。 。 . - [调试 RxJS, 第 2: 日志](https://ncjamieson.com/debugging-rxjs-part-2-logging/)。 。 。 . - 网上有个例子 [GitHub 页面](https://cartant.github.io/rxjs-spy/)。 。 。 . ## 安装 使用国家防范机制安装软件包: ``` npm install rxjs-spy --save-dev ``` 并导入用于 TypeScript 或 ES2015 的函数: ```js import { create } from "rxjs-spy"; const spy = create(); ``` 或者说 `require` 用于节点或普通JS捆绑器的模块: ```js const { create } = require("rxjs-spy"); const spy = create(); ``` 或包括用作 `script`数字 : ```html ``` ## 核心概念 `rxjs-spy` 介绍a `tag` 可用于识别可观测物的运算符。 它给可观察者附加了字符串标记;它不进行额外的处理,也不以任何方式改变可观察者的行为或价值. 这个 `tag` 运算符可用 `pipe`数字 : ```js import { tag } from "rxjs-spy/operators/tag"; const source = Observable.of("some-value").pipe(tag("some-tag")); ``` API的方法基于标记,并可以使用明确的文字,正则表达式或函数上游来匹配标记. 例如,可以启用上述标记的日志: ```js import { create } from "rxjs-spy"; const spy = create(); spy.log("some-tag"); // Or like this: spy.log(/^some-tag$/); // Or like this: spy.log(tag => tag === "some-tag"); ``` `rxjs-spy` 曝光拟从代码调用的一个模块 API 和一个控制台 API - 通过 `spy` global - 拟通过浏览器控制台交互使用. ## 模块 API 模块 API 中的方法可以通过导入、 需要或 UMD 调用 `rxjsSpy` 全球。 多数方法返回一个将取消API方法在被调用时的动作的被拆解函数. - [`create`](https://npmcn.com/package/%40avalane/rxjs-spy/#readme-module-create) - [`Spy.show`](https://npmcn.com/package/%40avalane/rxjs-spy/#readme-module-show) - [`Spy.log`](https://npmcn.com/package/%40avalane/rxjs-spy/#readme-module-log) - [`Spy.pause`](https://npmcn.com/package/%40avalane/rxjs-spy/#readme-module-pause) - [`Spy.let`](https://npmcn.com/package/%40avalane/rxjs-spy/#readme-module-let) - [`Spy.debug`](https://npmcn.com/package/%40avalane/rxjs-spy/#readme-module-debug) - [`Spy.flush`](https://npmcn.com/package/%40avalane/rxjs-spy/#readme-module-flush) - [`Spy.plug`](https://npmcn.com/package/%40avalane/rxjs-spy/#readme-module-plug) - [`Spy.unplug`](https://npmcn.com/package/%40avalane/rxjs-spy/#readme-module-unplug) - [`Spy.find`](https://npmcn.com/package/%40avalane/rxjs-spy/#readme-module-find) - [`Spy.findAll`](https://npmcn.com/package/%40avalane/rxjs-spy/#readme-module-findAll) - [`Spy.stats`](https://npmcn.com/package/%40avalane/rxjs-spy/#readme-module-stats) - [`Spy.teardown`](https://npmcn.com/package/%40avalane/rxjs-spy/#readme-module-teardown) - [`detect`](https://npmcn.com/package/%40avalane/rxjs-spy/#readme-module-detect) ### 创建 ```ts function create(options: { [key: string]: any, audit?: number, defaultLogger?: PartialLogger, defaultPlugins?: boolean, warning?: boolean } = {}): Teardown ``` 通话 `create` 把间谍交给 `Observable.prototype.subscribe` 并返回以下接口: ```ts interface Spy { readonly tick: number; debug(match: Match, ...notifications: Notification[]): Teardown; find(ctor: Ctor): T | undefined; findAll(ctor: Ctor): T[]; findAll(): Plugin[]; flush(): void; let(match: Match, select: (source: Observable) => Observable, options?: Options): Teardown; log(match: Match, partialLogger?: PartialLogger): Teardown; log(partialLogger?: PartialLogger): Teardown; pause(match: Match): Deck; plug(...plugins: Plugin[]): Teardown; show(match: Match, partialLogger?: PartialLogger): void; show(partialLogger?: PartialLogger): void; stats(partialLogger?: PartialLogger): void; teardown(): void; unplug(...plugins: Plugin[]): void; } ``` 默认, `create` 将连接快照插件和其他许多插件。 但是,如果 `defaultPlugins` 选项指定为 `false`中,没有插件会被连接,调用者可以单独使用 `plug` 方法。 例如: ```ts import { create } from "rxjs-spy"; import { GraphPlugin, SnapshotPlugin } from "rxjs-spy/plugin"; const spy = create({ defaultPlugins: false }); spy.plug( new GraphPlugin({ keptDuration: -1 }), new SnapshotPlugin(spy, { keptValues: 1 }) ); ``` 如果 `audit` 选项,将在指定的(毫秒)期限内对通知的记录进行审计。 每个通知来源在每个期间只记录一次,被忽略的通知(如果有的话)的数目将包括在控制台输出中。 这对记录高频观测数据可能有用. `audit` 默认为零 - 即不审计. 转到 `create` 被传送到插件上,所以可以指定以下内容: | 选项 | 类型 | 说明 | 默认 | | --- | --- | --- | --- | | `keptDuration` | `number` | 未订阅后应当保存订阅图和快照的毫秒数 . | 3万块 | | `keptValues` | `number` | 应保存在快照中的最大值 . | 页:1 | | `sourceMaps` | `boolean` | 是否为 `StackTracePlugin` 应当使用源地图. | `false` | 这种方法返回了拆解函数 . ### 显示 ```ts interface Spy { show( match: string | RegExp | MatchPredicate | Observable, partialLogger: PartialLogger = console ): void; show( partialLogger: PartialLogger = console ): void; } ``` `show` 将记录与控制台或指定的日志匹配的可观测信息。 若无 `match` 指定,所有标记的可观测数据都将被记录. 已登录的信息是从最新的快照中检索到的,所以如果快照无法启用,则会出错. ### 日志 ```ts interface Spy { log( match: string | RegExp | MatchPredicate | Observable, partialLogger: PartialLogger = console ): Teardown; log( partialLogger: PartialLogger = console ): Teardown; } ``` 连接日志插件的示例以匹配可观察值 。 如果没有 `match` 指定,所有标记的可观测数据都将被记录. 全体 `subscribe`, (中文(简体) ), `next`, (中文(简体) ), `complete`, (中文(简体) ), `error` 财务报告和审定财务报表 `unsubscribe` 通知将登录到控制台或指定的日志上. 这种方法返回了拆解函数 . ### 暂停 ```ts interface Spy { pause( match: string | RegExp | MatchPredicate | Observable ): Deck; } ``` 为匹配可观测到的暂停插件设置一个实例 . 所有匹配可观测对象的订阅将被设置为暂停状态,否则将发布的通知将在插件内被缓冲. 此方法返回 a `Deck` 实例 `resume` 财务报告和审定财务报表 `pause` 观察者. ```ts interface Deck { readonly paused: boolean; clear(): void; log(partialLogger: PartialLogger = console): void; pause(): void; resume(): void; skip(): void; step(): void; teardown(): void; } ``` 通话 `step` 将发布一次暂停通知。 其他方法 他们的名字暗示。 通话 `resume` 将在恢复前播放所有缓冲通知. ### 让 ```ts interface Spy { let( match: string | RegExp | MatchPredicate | Observable, select: (source: Observable) => Observable, options?: Options ): Teardown; } ``` 连接一个用于匹配可观察到的放电插件的实例 . 这相当于 `let` 操作员。 匹配可观测对象的所有订阅将改为指定返回的可观测对象 `select` 函数. 若为 `complete` 选项 `false`,从选定的可观察者收到的完成通知将不转发给订阅者. 这种方法返回了拆解函数 . ### 调试 ```ts interface Spy { debug( match: string | RegExp | MatchPredicate | Observable, ...notifications: ("complete" | "error" | "next" | "subscribe" | "unsubscribe")[] ): Teardown; } ``` 连接调试插件的实例, 以匹配可观察到的 . 当出现指定通知时 `debugger` 插件中的语句将暂停执行。 如果调用中未指定通知,则当任何通知发生时会暂停执行. 这种方法返回了拆解函数 . ### 冲出 ```ts interface Spy { flush(): void; } ``` 通话 `flush` 将看到 `flush` 调用每个插件 . 如果启用了快照, 请调用 `flush` 将会从快照中释放出多余的值并完成或出错的可操作性. ### 插头 ```ts interface Spy { plug(...plugins: Plugin[]): Teardown; } ``` 将指定的插件上线并返回一个被撕毁的功能. ### 取消插头 ```ts interface Spy { unplug(...plugins: Plugin[]): void; } ``` 删除指定的插件 . ### 寻找 ```ts interface Spy { find(constructor: { new (...args: any[]): T }): T | undefined; } ``` 返回第一个匹配指定构造器/类的插件 . ### 查找全部 ```ts interface Spy { findAll(constructor: { new (...args: any[]): T }): T[]; findAll(): T[]; } ``` 返回所有匹配指定构造器/类的插件 。 或者没有指定所有构造器的插件 . ### 数据 ```ts interface Spy { stats(partialLogger: PartialLogger = console): void; } ``` 写作,到控制台,计算通知数量等. ### 拆开 ```ts interface Spy { teardown(): void; } ``` 撕下间谍. ### 检测 ```ts function detect(id: string): void; ``` 向控制台写上自上次以来发生的任何订阅和未订阅 `detect` 使用指定的调用 `id`。 。 。 . 这个 `detect` 方法被执行,以便可以导入和调用,无论间谍是否配置。 也就是说,电话可以在生产代码中留下,因为它们成为无操作程序. 应该这样进口: ```ts import { detect } from "rxjs-spy/detect"; ``` ## 控制台 API 控制台中的方法 API 可以通过 `spy` global),并打算在浏览器控制台中交互使用. 它们与使用模块API创建的间谍事件的方法相同,只是它们不返回被撕毁的功能. 相反,可以使用 `undo` API方法. - [`spy.undo`](https://npmcn.com/package/%40avalane/rxjs-spy/#readme-console-undo) - [`spy.deck`](https://npmcn.com/package/%40avalane/rxjs-spy/#readme-console-deck) ### 撤销 ```ts function undo(...calls: number[]): void ``` 在没有争论的情况下 `undo` 方法将在控制台显示列表 `rxjs-spy` 可以取消的电话. 电话按电话号码列出,其中一个或多个号码可转给 `undo` 以取消特定电话. 正在撤销 `spy` 电话会取消所有的电话. ### 甲板 ```ts function deck(call?: number): Deck | undefined ``` 在控制台里,很容易忘记使用变量来捕捉 `Deck` 通过呼叫返回 `pause`。在这种情况下,你可以打电话给 `deck` 方法,不显示一个编号列表 `pause` 打电话 通话 `deck` 再通过一个电话, 将返回 `Deck` 与指定的 `pause` 电话. ## 常见问题 ### @avalane/rxjs-spy 是什么？ RxJS 调试库 ### 如何安装 @avalane/rxjs-spy？ 在项目目录运行 npm install @avalane/rxjs-spy，或使用 pnpm add / yarn add / bun add。它还需要宿主项目提供 peer 依赖：rxjs（^7\.0\.0）。npm 7 及以上与 pnpm 8 及以上默认会自动安装必需的 peer 依赖，Yarn 需要手动安装。 ### @avalane/rxjs-spy 支持 TypeScript 吗？ 支持。包内自带 TypeScript 类型声明（package\.json 声明了 types 入口），安装后即可获得类型提示，无需再安装 @types 包。 ### @avalane/rxjs-spy 支持 ESM 还是 CommonJS？ 同时提供 ES Module 与 CommonJS 入口，import 和 require\(\) 都可以使用，打包工具会自动选择合适的版本。 ### @avalane/rxjs-spy 可以商用吗？ @avalane/rxjs-spy 使用 MIT 许可。宽松许可：允许商业使用、修改和再分发，通常只需在分发时保留原版权与许可声明。以上为概括，不构成法律意见，请以许可原文为准。 ### @avalane/rxjs-spy 的下载量有多少？ 根据 npm 官方下载统计，@avalane/rxjs-spy 在 2026/10/07 – 2026/11/05 这 30 天内被下载 4,008 次，日均约 134 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入，适合横向比较热度，不能直接等同于使用人数。 ### @avalane/rxjs-spy 还在维护吗？ 最新版本 8\.0\.4 发布于 2025/08/16（1\.2 年前）；至今共发布 1 个版本，其中过去 12 个月发布了 0 个；首次发布于 2025/08/16。发布频率只是参考信号：功能稳定的工具可能很少需要更新，建议结合源码仓库的 issue 和提交记录判断。