# @fluidframework/devtools-core 中文文档

规范地址：https://npmcn.com/package/%40fluidframework/devtools-core/

版本：3\.12\.0
npm 元数据更新时间：2026-11-10T22:59:38.120Z
中文译文更新时间：2026-11-15T02:20:06.470Z
软件包许可：MIT

本文由上游 README 翻译，可能存在偏差，请结合原文核对 API、命令与配置。版权与许可归原作者所有。

原始 npm 页面：https://www.npmjs.com/package/%40fluidframework/devtools-core
原文对照：https://npmcn.com/package/%40fluidframework/devtools-core/?lang=original
项目主页：https://fluidframework.com/
源码仓库：https://github.com/microsoft/FluidFramework

## 关键信息（来自 npm 元数据）

- 包体积（解压后）：1.3 MB，535 个文件
- 模块格式：ES Module
- TypeScript 类型：包内自带
- 运行依赖：19 个
- 首次发布：2023-12-19T17:14:57.156Z
- 最新版本发布：2026-11-10T22:59:37.727Z
- 近 30 天下载量：5331（2026-10-15 至 2026-11-13，npm 官方下载统计）
- 已发布版本数：224（近 12 个月 48 个）

## 中文简介

流体框架开发工具核心功能

## 安装

```sh
npm install @fluidframework/devtools-core
```

也可以使用：`pnpm add @fluidframework/devtools-core`、`yarn add @fluidframework/devtools-core`、`bun add @fluidframework/devtools-core`

## README

# @ fluidframework/ devtools- core (英语)

这个库包含开发者工具,与流体框架一起使用. 它用来为我们的联系人提供动力 [浏览器扩展](https://github.com/microsoft/FluidFramework/tree/main/packages/tools/devtools/devtools-browser-extension)。 。 。 .

-   颜色 : [https://aka.ms/fluid/devtool/chrome (英语)](https://aka.ms/fluid/devtool/chrome)
-   边缘 : [https://aka.ms/fluid/devtool/edge (英语)](https://aka.ms/fluid/devtool/edge)

## 使用 Fluid 框架库

对于依赖流体框架库的公共API,我们建议 `^` (caret)版本范围. 例如,使用 `^1.3.4`。 。 。 .

依赖不稳定的API,例如: `beta` API,我们推荐一个更具限制性的版本范围. 例如,使用一个 `~` 版本范围.

## 安装

运行此命令以安装软件包 :

```bash
npm i @fluidframework/devtools-core -D
```

## 从此软件包导入

此软件包使用 [packet.json 导出](https://nodejs.org/api/packages.html#exports) 通过支持级别将API分离. 有关支助保障的信息改为: [API 支持级别](https://fluidframework.com/docs/build/releases-and-apitags/#api-support-levels)。 。 。 .

导入 `public` API 从 `@fluidframework/devtools-core`。 。 。 .

导入 `beta` API 从 `@fluidframework/devtools-core/beta`。 。 。 .

导入 `alpha` API 从 `@fluidframework/devtools-core/alpha`。 。 。 .

## API 文档

读取 **@ fluidframework/ devtools- core (英语)** API 文档 [https://fluidframework.com/docs/apis/devtools-core (中文(简体) )](https://fluidframework.com/docs/apis/devtools-core)。 。 。 .

## 使用量

Devtools的API表面被设计得与大多数应用流相适应.

### 初始化

要初始化您的容器的 devtools 会话, 请打电话 [`initializeDevtools`](https://fluidframework.com/docs/apis/devtools-core#initializedevtools-function)。 。 。 . 此函数接受 a `DevtoolsLogger` 用于接收应用程序中的流体遥测, 初始流体列表 `Containers` 和(可选择的)可视化定制数据可视化配置 `Container` 数据.

#### 关于 [`DevtoolsLogger`](https://fluidframework.com/docs/apis/devtools-core/devtoolslogger-class)

这个 `DevtoolsLogger` 调用时是可选的部件 `initializeDevtools` 但强烈建议您使用 因为Fluid Devtools中的几个特性 是由Fluid框架生成的遥测电源 和这个 记录器是这种遥测技术 进入流体地道的方法.

你可以得到一个 `DevtoolsLogger` 然后把它传给 `initializeDevtools` _财务报告和审定财务报表_ 页:1 `Loader` 用于创建/装入容器的实例如下所示. 这样日志将接收您应用程序中流体框架生成的所有遥测数据,并将其转发至 流水地道具为所需要.

```typescript
import { DevtoolsLogger, initializeDevtools } from "@fluidframework/devtools-core";

// Instantiate the logger
const devtoolsLogger = createDevtoolsLogger();

// Pass the logger when instantiating the Loader
const loader = new Loader({
    logger: devtoolsLogger,
    // Other necessary properties ...
});

// Use the Loader to create (and optionally, attach) a Container
const container = await loader.createDetachedContainer(/* params */);
await container.attach(/* params */);

// Initialize the Devtools passing the logger and your Container.
// The Container could be added later as well with devtools.registerContainerDevtools().
const devtools = initializeDevtools({
    logger: devtoolsLogger,
    initialContainers: [
        {
            container,
            containerKey: "My Container",
        },
    ],
});
```

如果你和我们合作 `AzureClient` 而不是上面描述的低级API,你可能想要 提及 [@ fluidframework/ devtools 软件包](https://www.npmjs.com/package/@fluidframework/devtools) 而不是这个.

在本地开发期间,建议您应收到申请 `DevtoolsLogger` 实例 _换成_ 用于在实际环境部署时通常会得到的任何伐木机,以避免当地开发活动来自 与真实的遥测相混合. 如果您仍然想要提供真实的应用程序日志并使用由遥测驱动的 Fluid Devtools 特性 同时,您可以将已有的日志传递给 `DevtoolsLogger` 构造器和它会推进所有遥测 它也收到该日志:

```typescript
import { DevtoolsLogger } from "@fluidframework/devtools-core";

// Your application's logger
const yourApplicationLogger = getInstanceOfYourApplicationLogger();

const devtoolsLogger = createDevtoolsLogger(yourApplicationLogger);

// Pass devtoolsLogger to initializeDevtools() and to your application as described above
```

### 清理

Devtools对象作为全局单子管理. 该单通在窗口"卸载"事件前自动被清理. 所以典型的应用流可能不需要担心清理. 也就是说,如果你想更严格地控制 当Devtools被撕毁, 你可以简单地叫它 `dispose` 返回手柄上的方法 [初始化](https://npmcn.com/package/%40fluidframework/devtools-core/#readme-initialization)。 。 。 .

## 协助制定一揽子计划

### 构建

要在当地构建软件包,首先确保您已运行 `pnpm install` 从一相相相根起. 接下来,要构建代码,运行 `npm run build` 从单雷波根起,或使用 [流体构造](https://github.com/microsoft/FluidFramework/tree/main/build-tools/packages/build-tools#running-fluid-build-command-line) 通过 `fluid-build -t build`。 。 。 .

-   注意: 一旦您从根运行了一个构建, 假设本软件包之外没有其它更改, 您可以运行 `npm run build` 直接在此目录中以更快的构建 . 如果您修改了此套件的本地依赖性, 您需要从根重运行一个构建, 然后再直接从此套件内重建 .

### 测试

要进行测试,首先确保您遵循 [构建](https://npmcn.com/package/%40fluidframework/devtools-core/#readme-build) 步骤. 下一个,运行 `npm run test` 从此目录中的终端.

## 客户最低要求

Fluid框架客户端库支持此文档中的平台. 这些要求有意具有限制性. 在一个主要的版本系列中,我们可以放松这些要求,但我们不能使其更严格. 对于长期支持(LTS)版本,我们可能需要支持这些平台几年.

其他配置可以奏效,但Fluid框架不支持. 如果一个不支持的配置停止工作, 我们不会将此归类为错误 . 要请求支持未列出的配置, 请存档 . 产品组会评估你的要求. 在此问题上,请具体说明配置的现状:

-   配置有效但需要官方支持.
-   配置不起作用,需要更改.

### 支持的运行时间

-   Fluid框架支持节点.js版本22和24同时收到 [上游支助](https://nodejs.org/en/about/previous-releases)。 。 。 .
    -   流体框架将停止支持第22版 [当上游支持于2027-04-30结束时](https://github.com/nodejs/release#release-schedule)。 。 。 .
    -   流体框架不支持节点.js与 `--no-experimental-fetch` 旗帜.
-   Fluid框架支持支持ES2022标准库的现代浏览器.

### 支持的工具

-   [类型脚本 6.0](https://typescriptdocs.com/release-notes/TypeScript%206.0)数字 :
    -   流体框架支持全部 [`strict`](https://www.typescriptlang.org/tsconfig) 选项.
    -   设定建设目标(`lib`, (中文(简体) ), `target`改为: `ES2022` 或后会.
    -   启用 [`strictNullChecks`](https://www.typescriptlang.org/tsconfig)。 。 。 .
    -   流体框架不支持 [在 TypeScript 6.0 中贬值的配置选项](https://typescriptdocs.com/release-notes/TypeScript%206.0#breaking-changes-and-deprecations-in-typescript-6-0)。 。 。 .
    -   流体框架不完全支持 `exactOptionalPropertyTypes`。 。 。 . 如果您启用此选项, 请不要使用 `in`, (中文(简体) ), `Reflect.has`, (中文(简体) ), `Object.hasOwn`,或 `Object.prototype.hasOwnProperty` 改为Fluid框架类型的窄成员. 这些方法可以错误地排除 `undefined` 从可能的值.
-   [网络软件包](https://webpack.js.org/) 页:1
    -   我们不需要一个特定的捆绑者. 其他处理ES模块的捆绑机可以工作,但我们只积极测试网页包.

### 模块分辨率

在类型脚本中 `compilerOptions`,使用时 [`Node16`, (中文(简体) ), `Node20`, (中文(简体) ), `NodeNext`,或 `Bundler`](https://www.typescriptlang.org/tsconfig#moduleResolution) 模块分辨率. 这些设置遵循 [节点.js v12+无害环境管理 分辨率和加载算法](https://nodejs.github.io/nodejs.dev/en/api/v20/esm/#resolution-and-loading-algorithm)。 。 。 .

不使用 `Node10` 模块分辨率.

### 模块格式

-   ES模块: 使用ES模块来消耗Fluid框架客户端软件包,包括在Node.js中.
-   常见JS : Fluid Framework在3.0版本或后期不正式支持CommonJS.

## 贡献准则

你们可以 [贡献](https://github.com/microsoft/FluidFramework/blob/main/CONTRIBUTING.md) 通过这些方式实现流体框架:

-   回答问题 [GitHub 讨论](https://github.com/microsoft/FluidFramework/discussions)。 。 。 .
-   [提交错误报告](https://github.com/microsoft/FluidFramework/issues) 并且帮助验证修正.
-   审查 [源代码更改](https://github.com/microsoft/FluidFramework/pulls)。 。 。 .
-   [贡献错误修正](https://github.com/microsoft/FluidFramework/blob/main/CONTRIBUTING.md)。 。 。 .

详细指示改为: [repo 文档](https://github.com/microsoft/FluidFramework/blob/main/docs/content/Home.md)。 。 。 .

本项目遵循 [Microsoft 开源行为守则](https://opensource.microsoft.com/codeofconduct/)。 。 。 . 更多信息,改为: [《行为守则》经常被问到的问题](https://opensource.microsoft.com/codeofconduct/faq/)。 。 。 . 问题或评论,联系 [打开码@ microsoft.com](mailto:opencode@microsoft.com)。 。 。 .

这个项目可能包含微软项目的商标或标志,产品,或服务. 这些商标或标志的使用必须遵循微软 [商标和品牌准则](https://www.microsoft.com/trademarks)。 。 。 . 在这个项目的修改后版本中使用微软商标或标志不得造成混淆或暗示微软赞助.

## 帮助

读取 [流体框架文件](https://fluidframework.com/docs/) 用于了解流体框架概念和API.

要求提供文件未载列的资料, [创建问题](https://github.com/microsoft/FluidFramework/blob/main/docs/content/Contributing/Submitting-Bugs-and-Feature-Requests.md)。 。 。 .

## 商标

这个项目可能包含微软项目的商标或标志,产品,或服务.

这些商标或标志的使用必须遵循微软的 [商标和品牌准则](https://www.microsoft.com/en-us/legal/intellectualproperty/trademarks/usage/general)。 。 。 .

在这个项目的修改后版本中使用微软商标或标志不得造成混淆或暗示微软赞助.

## 常见问题

### @fluidframework/devtools-core 是什么？

流体框架开发工具核心功能

### 如何安装 @fluidframework/devtools-core？

在项目目录运行 npm install @fluidframework/devtools-core，或使用 pnpm add / yarn add / bun add。

### @fluidframework/devtools-core 支持 TypeScript 吗？

支持。包内自带 TypeScript 类型声明（package\.json 声明了 types 入口），安装后即可获得类型提示，无需再安装 @types 包。

### @fluidframework/devtools-core 支持 ESM 还是 CommonJS？

以 ES Module 形式发布，推荐使用 import 引入。在 CommonJS 项目中，Node\.js 20\.19\+ / 22\.12\+ 可以直接 require\(\) 不含顶层 await 的 ES Module，更早的版本需要改用动态 import\(\)。

### @fluidframework/devtools-core 可以商用吗？

@fluidframework/devtools-core 使用 MIT 许可。宽松许可：允许商业使用、修改和再分发，通常只需在分发时保留原版权与许可声明。以上为概括，不构成法律意见，请以许可原文为准。

### @fluidframework/devtools-core 的下载量有多少？

根据 npm 官方下载统计，@fluidframework/devtools-core 在 2026/10/15 – 2026/11/13 这 30 天内被下载 5,331 次，日均约 178 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入，适合横向比较热度，不能直接等同于使用人数。

### @fluidframework/devtools-core 还在维护吗？

最新版本 3\.12\.0 发布于 2026/11/11（4 天前）；至今共发布 224 个版本，其中过去 12 个月发布了 48 个；首次发布于 2023/12/20。发布频率只是参考信号：功能稳定的工具可能很少需要更新，建议结合源码仓库的 issue 和提交记录判断。