# @appsignal/react 中文文档

规范地址：https://npmcn.com/package/%40appsignal/react/

版本：1\.0\.31
npm 元数据更新时间：2026-09-10T10:18:18.804Z
中文译文更新时间：2026-11-06T12:28:58.184Z
软件包许可：MIT

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

原始 npm 页面：https://www.npmjs.com/package/%40appsignal/react
原文对照：https://npmcn.com/package/%40appsignal/react/?lang=original
项目主页：https://github.com/appsignal/appsignal-javascript#readme
源码仓库：https://github.com/appsignal/appsignal-javascript

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

- 包体积（解压后）：35.9 kB，35 个文件
- 模块格式：ESM + CJS
- TypeScript 类型：包内自带
- 运行依赖：1 个
- peer 依赖：react \>= 16\.8\.6 \< 20
- 首次发布：2019-07-03T12:18:04.130Z
- 最新版本发布：2025-09-30T13:41:25.950Z
- 近 30 天下载量：138255（2026-10-07 至 2026-11-05，npm 官方下载统计）
- 已发布版本数：40（近 12 个月 0 个）

## 中文简介

-   \[AppSignal.com网站\] - \[文件\]\[docs\] - \[支持\]\[接触\]

## 安装

```sh
npm install @appsignal/react
```

也可以使用：`pnpm add @appsignal/react`、`yarn add @appsignal/react`、`bun add @appsignal/react`

## README

# `@appsignal/react`

-   [AppSignal.com网站 (中文(简体) )](https://appsignal.com/)
-   [文档](http://docs.appsignal.com/)
-   [支助](mailto:support@appsignal.com)

这个 `@appsignal/javascript` react v15+的集成.

另见 [单重播读取器](https://npmcn.com/package/README.md) 更多信息.

## 安装

添加数据 `@appsignal/react` 财务报告和审定财务报表 `@appsignal/javascript` 给您的软件包 `package.json`运行 `yarn install`编号 :`npm install`。 。 。 .

您也可以将这些软件包添加到您的 `package.json` 在命令行上 :

```
yarn add @appsignal/javascript @appsignal/react
npm install --save @appsignal/javascript @appsignal/react
```

## 使用量

### 错误边界

如果您正在使用 React v16 或更高,您可以使用 `ErrorBoundary` 组件以捕捉儿童组件树中任何地方的错误.

```jsx
import React from "react"
import ReactDOM from "react-dom"
import Appsignal from "@appsignal/javascript"
import { ErrorBoundary } from "@appsignal/react"

const appsignal = new Appsignal({
  key: "YOUR FRONTEND API KEY"
})

const FallbackComponent = () => (
  <div>Uh oh! There was an error :(</div>
)

const App = () => (
  <ErrorBoundary instance={appsignal} fallback={(error) => <FallbackComponent />}>
    { /** Child components here **/}
  </ErrorBoundary>
)

ReactDOM.render(<App />, document.getElementById("root"))
```

### 遗留边界

⚠️ **警报:** 该组件使用的API在React的开发中此时不稳定. 我们提出这个部分作为支持那些运行React v15的工具,但并不保证它的再联络. 鼓励您使用 `ErrorBoundary` 只要可能,就应该.

这个 `LegacyBoundary` 几乎完全一样 `ErrorBoundary`数字 :

```jsx
import React from "react"
import ReactDOM from "react-dom"
import Appsignal from "@appsignal/javascript"
import { LegacyBoundary } from "@appsignal/react"

const appsignal = new Appsignal({ 
  key: "YOUR FRONTEND API KEY"
})

const FallbackComponent = () => (
  <div>Uh oh! There was an error :(</div>
)

const App = () => (
  <LegacyBoundary instance={appsignal} fallback={(error) => <FallbackComponent />}>
    { /** Child components here **/}
  </LegacyBoundary>
)

ReactDOM.render(<App />, document.getElementById("root"))
```

## 发展

### 安装

确保安装单机 和靴子,看看 [项目README的开发部分](https://npmcn.com/package/README.md#dev-install) 更多信息.

您可以运行以下操作以启动编译器 _监视_ 模式。 自动编译 ES 模块和 CommunityJS 变体:

```bash
yarn build:watch
```

您也可以不查看目录而构建库 :

```
yarn build        # build both CJS and ESM
yarn build:cjs    # just CJS
yarn build:esm    # just ESM
```

### 测试

此库的测试 [欢乐](https://jestjs.io/) 作为测试跑者。 一旦您安装了依赖性, 您可以在这个寄存器的根部运行以下命令来运行所有软件包的测试, 或者在只运行与该软件包有关的测试的软件包目录中运行 :

```bash
yarn test
```

### 版本

此还原使用 [语义版本](http://semver.org/) (通常称为 _铸造_) (中文(简体) ). 寄存器中的每个软件包都是相互独立的版本.

@TODO:一旦我们更了解释放

## 捐款

考虑为这次再投资做贡献? 赞

请跟我们走 [贡献指南](http://docs.appsignal.com/appsignal/contributing.html) 我们的文件,并跟着我们 [行为守则](https://docs.appsignal.com/appsignal/code-of-conduct.html)。 。 。 .

而且,我们很乐意给你送来斯多普瓦夫斯 看看每个人,我们发送一个包裹 到目前为止,我们 [Stroopwafles 页面](https://appsignal.com/waffles)。 。 。 .

## 支助

[联系我们](mailto:support@appsignal.com) 直接和AppSignal的工程师交谈 他们会帮助你得到设置, 调整你的代码 并确保你得到最多的 使用AppSignal.

## 常见问题

### @appsignal/react 是什么？

\[AppSignal\.com网站\] - \[文件\]\[docs\] - \[支持\]\[接触\]

### 如何安装 @appsignal/react？

在项目目录运行 npm install @appsignal/react，或使用 pnpm add / yarn add / bun add。它还需要宿主项目提供 peer 依赖：react（\>= 16\.8\.6 \< 20）。npm 7 及以上与 pnpm 8 及以上默认会自动安装必需的 peer 依赖，Yarn 需要手动安装。

### @appsignal/react 支持 TypeScript 吗？

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

### @appsignal/react 支持 ESM 还是 CommonJS？

同时提供 ES Module 与 CommonJS 入口，import 和 require\(\) 都可以使用，打包工具会自动选择合适的版本。

### @appsignal/react 可以商用吗？

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

### @appsignal/react 的下载量有多少？

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

### @appsignal/react 还在维护吗？

最新版本 1\.0\.31 发布于 2025/09/30（1\.1 年前）；至今共发布 40 个版本，其中过去 12 个月发布了 0 个；首次发布于 2019/07/03。发布频率只是参考信号：功能稳定的工具可能很少需要更新，建议结合源码仓库的 issue 和提交记录判断。