# @felte/reporter-svelte 中文文档

规范地址：https://npmcn.com/package/%40felte/reporter-svelte/

版本：1\.2\.0
npm 元数据更新时间：2024-10-29T22:05:11.964Z
中文译文更新时间：2026-11-14T14:08:53.233Z
软件包许可：MIT

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

原始 npm 页面：https://www.npmjs.com/package/%40felte/reporter-svelte
原文对照：https://npmcn.com/package/%40felte/reporter-svelte/?lang=original
项目主页：https://github.com/pablo-abc/felte/tree/main/packages/reporter-svelte
源码仓库：https://github.com/pablo-abc/felte

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

- 包体积（解压后）：468 kB，14 个文件
- 模块格式：ESM + CJS
- TypeScript 类型：包内自带
- Node.js 要求：^12\.20\.0 \|\| ^14\.13\.1 \|\| \>=16\.0\.0
- 运行依赖：1 个
- peer 依赖：svelte ^3\.31\.0 \|\| ^4\.0\.0 \|\| ^5\.0\.0
- 首次发布：2021-02-14T22:11:15.399Z
- 最新版本发布：2024-10-29T22:05:11.752Z
- 近 30 天下载量：16416（2026-10-15 至 2026-11-13，npm 官方下载统计）
- 已发布版本数：83（近 12 个月 0 个）

## 中文简介

使用 Svelte 组件的 Felte 错误报告器

## 安装

```sh
npm install @felte/reporter-svelte
```

也可以使用：`pnpm add @felte/reporter-svelte`、`yarn add @felte/reporter-svelte`、`bun add @felte/reporter-svelte`

## README

# @felte/reporter-svelte (英语)

[![Tests](https://github.com/pablo-abc/felte/workflows/Tests/badge.svg)](https://github.com/pablo-abc/felte/actions/workflows/test.yml) [![Bundle size](https://img.shields.io/bundlephobia/min/@felte/reporter-svelte)](https://bundlephobia.com/result?p=@felte/reporter-svelte) [![NPM Version](https://img.shields.io/npm/v/@felte/reporter-svelte)](https://www.npmjs.com/package/@felte/reporter-svelte) [![codecov](https://codecov.io/gh/pablo-abc/felte/branch/main/graph/badge.svg?token=T73OJZ50LC)](https://codecov.io/gh/pablo-abc/felte)

一个使用自定义 Svelte 组件来报告错误的 Felte 报告器 .

## 安装

```sh
npm install --save @felte/reporter-svelte

# Or, if you use yarn

yarn add @felte/reporter-svelte
```

如果你在使用 sapper,你可能想要添加这个记者 作为一个 dev 依赖。 你可以通过添加 `-D` 标记为上面任何命令.

## 使用量

软件包导出一个报告函数 `reporter` 和一个 Svelte 组件 `ValidationMessage`。这些可以同时用于报告错误.

将记者添加到 `extend` 财产 `createForm` 配置 .

```javascript
import { reporter, ValidationMessage } from '@felte/reporter-svelte';

const { form } = createForm({
  // ...
  extend: reporter,
  // ...
});
```

为了显示一个字段的错误,您需要使用记者的组件. 举个例子

```html
<label for="email">Email:</label>
<input id="email" name="email" aria-describedby="email-validation">
<ValidationMessage for="email" let:messages={messages}>
  {messages?.[0] || ''}
</ValidationMessage>
```

这个 `for` 属性是指输入的ID。 这个 `messages` prop将拥有该字段错误的当前值。 如果您想要显示占位符元素而不是处理 falsy 错误值, 您可以使用 `placeholder` 插槽 .

```html
<ValidationMessage for="email" let:messages={message}>
  <span>{message?.[0]}</span>
  <span slot="placeholder">Some placeholder text</span>
</ValidationMessage>
```

## 警告

这个记者可以帮你展示你的 `warning` 信息也一样。 如果你想要的话 `ValidationMessage` 用于显示您需要设置字段的警告的组件 `level` 向值的道具 `warning`。默认情况下,此道具的值为 `error`。 。 。 .

```html
<ValidationMessage level="warning" for="email" let:messages={messages}>
  {messages?.[0] || ''}
</ValidationMessage>
```

## 常见问题

### @felte/reporter-svelte 是什么？

使用 Svelte 组件的 Felte 错误报告器

### 如何安装 @felte/reporter-svelte？

在项目目录运行 npm install @felte/reporter-svelte，或使用 pnpm add / yarn add / bun add。它还需要宿主项目提供 peer 依赖：svelte（^3\.31\.0 \|\| ^4\.0\.0 \|\| ^5\.0\.0）。npm 7 及以上与 pnpm 8 及以上默认会自动安装必需的 peer 依赖，Yarn 需要手动安装。

### @felte/reporter-svelte 支持 TypeScript 吗？

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

### @felte/reporter-svelte 支持 ESM 还是 CommonJS？

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

### @felte/reporter-svelte 需要什么版本的 Node\.js？

package\.json 的 engines 字段要求 Node\.js ^12\.20\.0 \|\| ^14\.13\.1 \|\| \>=16\.0\.0。版本不符时 npm 默认只给出警告，开启 engine-strict 后会拒绝安装。

### @felte/reporter-svelte 可以商用吗？

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

### @felte/reporter-svelte 的下载量有多少？

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

### @felte/reporter-svelte 还在维护吗？

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