# @flareapp/vue 中文文档

规范地址：https://npmcn.com/package/%40flareapp/vue/

版本：2\.13\.0
npm 元数据更新时间：2026-09-17T12:53:56.115Z
中文译文更新时间：2026-11-14T21:28:14.743Z
软件包许可：MIT

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

原始 npm 页面：https://www.npmjs.com/package/%40flareapp/vue
原文对照：https://npmcn.com/package/%40flareapp/vue/?lang=original
项目主页：https://flareapp.io/
源码仓库：https://github.com/spatie/flare-client-js

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

- 包体积（解压后）：61 kB，15 个文件
- 模块格式：ESM + CJS
- TypeScript 类型：包内自带
- 运行依赖：1 个
- peer 依赖：vue ^3\.0\.0，vue-router ^4\.0\.0 \|\| ^5\.0\.0，@flareapp/js ^2\.13\.0
- 首次发布：2024-01-24T16:50:52.072Z
- 最新版本发布：2026-09-17T12:53:55.631Z
- 近 30 天下载量：23215（2026-10-15 至 2026-11-13，npm 官方下载统计）
- 已发布版本数：28（近 12 个月 20 个）

## 中文简介

Vue 客户端为 shipapp.io

## 安装

```sh
npm install @flareapp/vue
```

也可以使用：`pnpm add @flareapp/vue`、`yarn add @flareapp/vue`、`bun add @flareapp/vue`

## README

# @ flareapp/ veue (帮助)

虚拟集成 [火焰](https://flareapp.io/) 错误跟踪和记录 。 安装一个 Vue 错误处理器, 捕获组件错误, 并将其报告给 Flare 并带有 Vue 特定上下文( 组件名称, 生命周期信息) .

## 安装

```bash
npm install @flareapp/vue @flareapp/js
```

## 快开始

初始化 Flare 客户端并注册 Vue 错误处理器 :

```js
import { createApp } from 'vue';
import { flare } from '@flareapp/js';
import { flareVue } from '@flareapp/vue';

import App from './App.vue';

flare.light('YOUR_FLARE_API_KEY');

const app = createApp(App);

flareVue(app);

app.mount('#app');
```

## 日志

除了出错,客户端还可以发送结构化日志. 日志是选入的: 启用这些日志 `enableLogs`,然后调用 8 syslog 级别(`debug`, (中文(简体) ), `info`, (中文(简体) ), `notice`, (中文(简体) ), `warning`, (中文(简体) ), `error`, (中文(简体) ), `critical`, (中文(简体) ), `alert`, (中文(简体) ), `emergency`) (中文(简体) ).

```js
import { flare } from '@flareapp/js';

flare.configure({ enableLogs: true });

flare.logger.info('Checkout started', { cartId: cart.id, total: cart.total });
```

## 识别用户

```js
import { flare } from '@flareapp/js';

flare.setUser({ id: 123, email: 'jane@example.com', fullName: 'Jane Doe' });
```

见 [JavaScript 识别用户文件](https://flareapp.io/docs/javascript/data-collection/identifying-users) 用于完整字段列表。 过 `null` 来清理.

## 文档

有关Vue 错误处理器及其选项的完整文档可在 [耀斑/docs/vue/一般/安装](https://flareapp.io/docs/vue/general/installation)。 。 。 .

## 构成部分概况

记录每个组件挂载的跨度, 嵌入在活性页面负荷或导航跟踪下。 需要追踪 (单位:千美元)`enableTracing: true`)和一个许可列表:

```js
app.use(flareVue, {
    router,
    profileComponents: ['ProductPage', 'CartPage', /^Checkout/],
});
```

`app.use(flareVue, …)` 财务报告和审定财务报表 `flare.configure({ enableTracing: true })` 可以按任一顺序运行。 安装 插件首先是精细的: 路由器守护和剖析器钩子在启动跟踪之前一直闲置.

字符串完全匹配组件名称。 正则表达式匹配 `test()`。 。 。 . `true` 配置每个命名 组件,该组件在探索时有用,但将在真实页面上按下每个痕量封顶的1024个跨度并掩埋 横跨你关心.

名称来自错误报告所用的同一分辨率: SFC 编译器的名称来自文件名, 然后是明确的 `name` 选项,然后 `AnonymousComponent`重新命名一个部件 静悄悄地停止了它.

只记录了山峰。 更新, `<KeepAlive>` 重新启动和卸载不是.

在一个已经挂起的外形外形外形外形外形的外形内 挂起的部位 仍然在外形外的外形下 当它完成安装时, 它的长度关闭 。 树是正确的,但瀑布显示孩子从 其父母终止。 一个在持续布局内互换的页面正文,是看到这一点的通常方式.

**Async 组件和 `<Suspense>`数字 :** Vue 将组件作为挂载器处理 _同步_ 儿童 已挂载。 带有同步的组件 `setup()`,或其中的一个 `<Suspense>` 边界,因此 在它的被描述的祖先的跨度关闭后,它出现在瀑布的后方。 如果 到那时,整个痕量被关闭, 跨度被抛出,而不是附在完成的痕量上.

### 自主时间

每个部件都带 `flare.component.self_time_ns`: 长度减去时间 儿童概况。 时间重叠的孩子被计算一次, 所以价值永远不会去 低于零.

在父母的跨度关闭后挂起的孩子不减少。 它的工作发生在 父窗口,所以母窗口保持全长.

一个布局是通常的例子. `vue-router` 解析布局挂载后的第一个路由, 所以页面 组件的工作位于布局窗口之外.

### 以 Inertia 命名

Inertia 名称导航从页面对象的页面组件后跨出, 因此根读取 `Products/Show`。 。 。 . 文件后面的 Vue 名称组件, 所以 `./Pages/Products/Show.vue` 实值 `Show`,以及 `./Pages/Orders/Show.vue` 实值 (单位:千美元) `Show`。如果想要将两者读取相同,则在页面组件中明确设置名称:

```vue
<script setup>
defineOptions({ name: 'Products/Show' });
</script>
```

没有它,跨度使用赤色文件名,通常仍然可以读取,因为根会分解.

## 兼容性

-   第3组

## 许可证

麻省理工学院许可证(MIT). 请看 [许可证文件](https://npmcn.com/package/LICENSE.md) 更多信息.

## 常见问题

### @flareapp/vue 是什么？

Vue 客户端为 shipapp\.io

### 如何安装 @flareapp/vue？

在项目目录运行 npm install @flareapp/vue，或使用 pnpm add / yarn add / bun add。它还需要宿主项目提供 peer 依赖：vue（^3\.0\.0）、@flareapp/js（^2\.13\.0）。npm 7 及以上与 pnpm 8 及以上默认会自动安装必需的 peer 依赖，Yarn 需要手动安装。

### @flareapp/vue 支持 TypeScript 吗？

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

### @flareapp/vue 支持 ESM 还是 CommonJS？

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

### @flareapp/vue 可以商用吗？

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

### @flareapp/vue 的下载量有多少？

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

### @flareapp/vue 还在维护吗？

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

