# @battlefieldduck/xterm-svelte 中文文档

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

版本：2\.3\.0
npm 元数据更新时间：2026-05-17T18:10:55.745Z
中文译文更新时间：2026-11-07T18:19:56.588Z
软件包许可：MIT

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

原始 npm 页面：https://www.npmjs.com/package/%40battlefieldduck/xterm-svelte
原文对照：https://npmcn.com/package/%40battlefieldduck/xterm-svelte/?lang=original
项目主页：https://xterm-svelte.pages.dev/
源码仓库：https://github.com/BattlefieldDuck/xterm-svelte

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

- 包体积（解压后）：22.3 kB，13 个文件
- 模块格式：ES Module
- TypeScript 类型：包内自带
- 运行依赖：11 个
- peer 依赖：svelte ^5\.55\.7
- 首次发布：2024-04-28T02:51:10.823Z
- 最新版本发布：2026-05-17T18:10:55.472Z
- 近 30 天下载量：11262（2026-10-08 至 2026-11-06，npm 官方下载统计）
- 已发布版本数：11（近 12 个月 3 个）

## 中文简介

Xterm.js的一款SvelteKit包装机,可以将终端嵌入到SvelteKit应用中,管理Xterm addons,并与最新的SvelteKit和Xterm.js版本提供无缝更新.

## 安装

```sh
npm install @battlefieldduck/xterm-svelte
```

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

## README

# X 任期 Svelte

![](https://github.com/BattlefieldDuck/xterm-svelte/assets/29337428/e1055940-ae66-48b5-9a1f-1965949b5757)

[![Node.js Build](https://github.com/BattlefieldDuck/xterm-svelte/actions/workflows/node-build.yml/badge.svg)](https://github.com/BattlefieldDuck/xterm-svelte/actions/workflows/node-build.yml) ![NPM Type Definitions](https://img.shields.io/npm/types/%40battlefieldduck%2Fxterm-svelte) [![NPM Version](https://img.shields.io/npm/v/%40battlefieldduck%2Fxterm-svelte)](https://www.npmjs.com/package/@battlefieldduck/xterm-svelte) ![NPM Downloads](https://img.shields.io/npm/dw/%40battlefieldduck%2Fxterm-svelte) ![NPM Downloads](https://img.shields.io/npm/d18m/%40battlefieldduck%2Fxterm-svelte) ![NPM License](https://img.shields.io/npm/l/%40battlefieldduck%2Fxterm-svelte)

xterm- svelte 是用于 [x 任期.js](https://github.com/xtermjs/xterm.js) 库,旨在与斯维尔特基特无缝工作. 这个库允许您在您的 SvelteKit 应用程序中嵌入一个功能完备的终端 .

检查一下: [https://xterm-svelte.pages.dev (中文(简体) )](https://xterm-svelte.pages.dev/)

## 版本兼容性

| 版本 | 斯维尔特版本 | 处 | 示威 |
| --- | --- | --- | --- |
| 2.x.x (中文(简体) ) | 斯维尔特5号 | [`main`](https://github.com/BattlefieldDuck/xterm-svelte) | [https://xterm-svelte.pages.dev (中文(简体) )](https://xterm-svelte.pages.dev/) |
| 1.x.x (中文(简体) ) | 第4节 | [`svelte4`](https://github.com/BattlefieldDuck/xterm-svelte/tree/svelte4) | [https://svelte4.xterm-svelte.pages.dev. (原始内容存档于2018-09-31)](https://svelte4.xterm-svelte.pages.dev/) |

关于从1.x.x到2.x.x的迁移详情,请参见 [移徙指南](https://github.com/BattlefieldDuck/xterm-svelte/releases/tag/2.0.0)。 。 。 .

## 特征

-   **与 SvelteKit 完全整合**
    
    Xterm-Svelte旨在与SvelteKit无缝地工作,使您可以轻松地将终端功能纳入您的SvelteKit项目.
    
-   **X 期加额管理**
    
    Xterm加通由Xterm-Svelte内部管理,为与Xterm及其加通合作提供统一而一致的接口.
    
-   **持续更新软件包**
    
    Xterm-Svelte定期更新,以确保与SvelteKit和Xterm.js的最新版本相容. 这意味着您可以在您的项目中使用这些图书馆的最新功能和改进.
    

## 安装

要安装 Xterm- Svelte, 请在您的工程目录中运行以下命令 :

```bash
npm install @battlefieldduck/xterm-svelte
```

## 使用量

以下是在您的 SvelteKit 应用程序中如何使用 xterm- svelte 的基本示例 :

```svelte
<script lang="ts">
    import { Xterm, XtermAddon } from '@battlefieldduck/xterm-svelte';
    import type {
        ITerminalOptions,
        ITerminalInitOnlyOptions,
        Terminal
    } from '@battlefieldduck/xterm-svelte';

    let terminal = $state<Terminal>();

    const options: ITerminalOptions & ITerminalInitOnlyOptions = {
        fontFamily: 'Consolas'
    };

    async function onLoad() {
        console.log('Child component has loaded');

        // FitAddon Usage
        const fitAddon = new (await XtermAddon.FitAddon()).FitAddon();
        terminal?.loadAddon(fitAddon);
        fitAddon.fit();

        terminal?.write('Hello World');
    }

    function onData(data: string) {
        console.log('onData()', data);
    }

    function onKey(data: { key: string; domEvent: KeyboardEvent }) {
        console.log('onKey()', data);
    }
</script>

<Xterm bind:terminal {options} {onLoad} {onData} {onKey} />
```

## 财务问题

### 我什么时候用 `onLoad()`? 吗?

这个 `onLoad()` 函数在 Xterm 终端初始化时起火。 您可以使用此函数执行动作, 如初始化 xterm addons .

## 实际用途

-   [比特语](https://github.com/bitorscanner/Bitor): 比特扫描软件
-   [Asm 编辑器](https://github.com/Specy/asm-editor):一个现代的网络应用来写作,运行和学习M68K,MIPS,RISC-V,X86组装
-   [希尔维](https://github.com/AlchemillaHQ/Sylve): 用于管理 Bhyve, 监狱, ZFS, 网络, 以及更多 FreeBSD 的轻量级 GUI
-   [还有更多...](https://github.com/BattlefieldDuck/xterm-svelte/network/dependents)

## 捐款

欢迎捐款! 请随意提交拉力请求或未决问题.

![https://github.com/BattlefieldDuck/xterm-svelte/graphs/contributors](https://contrib.rocks/image?repo=BattlefieldDuck/xterm-svelte)

## 许可证

xterm-svelte根据麻省理工学院许可证获得许可证。 见 `LICENSE` 以备详细文件.

## 随时间演变的星舰

[![Stargazers over time](https://starchart.cc/BattlefieldDuck/xterm-svelte.svg?variant=adaptive)](https://starchart.cc/BattlefieldDuck/xterm-svelte)

## 常见问题

### @battlefieldduck/xterm-svelte 是什么？

Xterm\.js的一款SvelteKit包装机,可以将终端嵌入到SvelteKit应用中,管理Xterm addons,并与最新的SvelteKit和Xterm\.js版本提供无缝更新\.

### 如何安装 @battlefieldduck/xterm-svelte？

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

### @battlefieldduck/xterm-svelte 支持 TypeScript 吗？

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

### @battlefieldduck/xterm-svelte 支持 ESM 还是 CommonJS？

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

### @battlefieldduck/xterm-svelte 可以商用吗？

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

### @battlefieldduck/xterm-svelte 的下载量有多少？

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

### @battlefieldduck/xterm-svelte 还在维护吗？

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