# @cplieger/web-terminal-ui 中文文档 规范地址：https://npmcn.com/package/%40cplieger/web-terminal-ui/ 版本：9\.0\.0 npm 元数据更新时间：2026-11-13T10:10:33.748Z 中文译文更新时间：2026-11-13T10:11:57.892Z 软件包许可：MPL-2\.0 本文由上游 README 翻译，可能存在偏差，请结合原文核对 API、命令与配置。版权与许可归原作者所有。 原始 npm 页面：https://www.npmjs.com/package/%40cplieger/web-terminal-ui 原文对照：https://npmcn.com/package/%40cplieger/web-terminal-ui/?lang=original 项目主页：https://github.com/cplieger/web-terminal-ui 源码仓库：https://github.com/cplieger/web-terminal-ui ## 关键信息（来自 npm 元数据） - 包体积（解压后）：805 kB，78 个文件 - 模块格式：ES Module - TypeScript 类型：包内自带 - 运行依赖：0 个 - peer 依赖：@cplieger/web-terminal-engine ^6\.5\.0 - 首次发布：2026-06-29T13:23:29.218Z - 最新版本发布：2026-11-13T10:10:33.446Z - 近 30 天下载量：10372（2026-10-11 至 2026-11-09，npm 官方下载统计） - 已发布版本数：126（近 12 个月 126 个） ## 中文简介 @cplieger/web-terminal-engine的参考触摸第一浏览器UI:可相容的内核+功能模块(tabs,活性显示器,移动工具栏,上下文菜单,IME,预测回声,取景口处理)和CSS. 一个创建 Terminal () 呼叫 . ## 安装 ```sh npm install @cplieger/web-terminal-ui ``` 也可以使用：`pnpm add @cplieger/web-terminal-ui`、`yarn add @cplieger/web-terminal-ui`、`bun add @cplieger/web-terminal-ui` ## README # @cplieger/web-terminal-ui (英语) [![npm](https://img.shields.io/npm/v/@cplieger/web-terminal-ui)](https://www.npmjs.com/package/@cplieger/web-terminal-ui) [![JSR](https://jsr.io/badges/@cplieger/web-terminal-ui)](https://jsr.io/@cplieger/web-terminal-ui) [![Mutation (TS)](https://img.shields.io/endpoint?url=https://raw.githubusercontent.com/cplieger/web-terminal-ui/badges/mutation-ts.json)](https://github.com/cplieger/web-terminal-ui/issues?q=label%3Astryker-tracker) web-terminal-ui 创建浏览器终端 [网络终端引擎](https://github.com/cplieger/web-terminal-engine) 在电话和桌面上工作,有标签、平面视图和屏幕上键栏. ![The terminal UI with six tabs carrying progress, working and error indicators, the split view open with a git log on the left and a build and fuzz run on the right, and the tab menu open on Snap to left](https://npmcn.com/package/%40cplieger/web-terminal-ui/docs/images/header.png) 它取代了标签,密钥栏,粘贴菜单,IME处理和软键板重塑大小,否则会围绕引擎的渲染器来构建. 它作为TypeScript source在npm和JSR上发行,并附有CSS捆绑和参考页. 它唯一的依赖是同伴 `@cplieger/web-terminal-engine` 6.x,并且根据MPL-2.0获得许可. ## 为什么用它 网-地铁-地铁-地铁(web-terminal-ui)是为由网-地铁(web-terminal-engine)服务的一个外壳或编码代理而建,从手机和从桌面一样频繁地使用. - 一个 `createTerminal()` 调用在您提供的元素中构建 UI 。 4个预设覆盖了单,一触和两个制表布局. - 在触摸屏上,它添加了带有Tab, Esc, 箭头, Enter 和粘接 Ctrl 的密钥栏,长压粘贴菜单和iOS软键板处理. - 标签显示程序的活动点 `OSC 7501` 状态, `OSC 9;4` 进展和分类 `OSC 9` 通知,并增加浏览器通知。 二分分能相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相相 一个全页终端给出了每个分页,每个分页地址,并在活动分页后命名浏览器分页,然后是该分页自己的标题 : `fix build · Web Terminal`。 。 。 . - 原生文字选择,IME输入和拼接工作,并预测回声会隐藏后遗症. 考虑 [x 任期.js](https://github.com/xtermjs/xterm.js) 如果您想要任何PTY后端的终端组件,例如节点-pty。 它有一个可选的GPU加速渲染器和一套加成器,VS代码使用. 要在网络地铁引擎上建立自己的UI,只依靠引擎. ## 安装 ```sh npm install @cplieger/web-terminal-ui @cplieger/web-terminal-engine npx jsr add @cplieger/web-terminal-ui @cplieger/web-terminal-engine ``` 引擎是一个对等依赖,所以同时安装. ## 使用量 终端连接到一个会讲引擎的服务器 [电线协议](https://github.com/cplieger/web-terminal-engine#wire-protocol)比如在引擎的"去"上建造的 `terminal` 软件包或 [网络终端服务器](https://github.com/cplieger/web-terminal-server)。一个普通的 PTY- over- WebSocket 服务器不会说话 . ```ts import { createTerminal } from "@cplieger/web-terminal-ui"; import { presetTabbed } from "@cplieger/web-terminal-ui/presets"; createTerminal("#terminal", { features: presetTabbed }); ``` 将挂载目标作为选择器传递,并将预设为函数,如上。 一个缺失的元素或抛出预设然后到达库的启动失败处理,而不是从您的呼叫站点逃出. 打电话 `createTerminal` 每份文件一次,或 `destroy()` 在建造另一个终端之前的第一个终端. 没有预建的 JavaScript 船, 因此您的构建会编译 TypeScript 源 。 也为CSS服务. 对于全页终端,请加入列出的文件 `css/MANIFEST` 输入一个样式表,并为 Monaspace Neon NF 字体文件服务 `/vendor/fonts/`中的终端,请使用 `css/MANIFEST.single`, (中文(简体) ), `css/MANIFEST.touch` 或者说 `css/MANIFEST.tabbed` 转而通过 `layout: "container"`。 。 。 . `scaffold/index.html` 是带有导入地图的完整页. 四个预设: - `presetSingle()` 是一个桌面终端,包含上下文菜单、剪贴板、从下到下滚动、预测回声和连接横幅. - `presetTouch()` 添加密钥栏 . - `presetTabbed()` 增加分页,活性点和动画. 它需要引擎的会话API,即网络终端服务器服务. - `presetAgentTabbed()` 相同,每个标签的点从头显示,用于代理 shell . [设置主机页面](https://npmcn.com/package/%40cplieger/web-terminal-ui/docs/host-page.md) 完整覆盖CSS,字体和预设. ## API 密码 - `createTerminal(target, options)` 构建终端并返回一个控件 `focus()`, (中文(简体) ), `send(bytes)`, (中文(简体) ), `reset()`, (中文(简体) ), `reattach()` 财务报告和审定财务报表 `destroy()`附加时 `split` 下级 `split: true`。 。 。 . [选项和终端控件](https://npmcn.com/package/%40cplieger/web-terminal-ui/docs/configuration.md) 列出每个选项. - 预设来自 `@cplieger/web-terminal-ui/presets`,或一次从 `/presets/single`, (中文(简体) ), `/presets/touch`, (中文(简体) ), `/presets/tabbed` 财务报告和审定财务报表 `/presets/agent-tabbed`。单个特性来自 `/features/`。 。 。 . - `localScrollbackStorage()` 即时存储 `persistScrollback` 选项,以及 `clearLocalScrollback()` 移除它保存的东西. - `PUBLIC_THEME_TOKENS` 财务报告和审定财务报表 `LOADING_OVERLAY_CLASSES`时,也 `/style-contract`,列出主题密钥和覆盖类. `STARTUP_FAILURE_COPY`时,也 `/startup-copy`,保留失败面板的措辞. - 类型涵盖选项,手柄,特性及其上下文,启动失败和分拆控制器. 全文见 [日 尔](https://jsr.io/@cplieger/web-terminal-ui/doc)。 。 。 . ## 启动失败并结束会话 当启动失败有可渲染的地方时, 库会显示一个“ Terminal 失败启动” 面板 **重新装入** 按钮并降低您的加载覆盖. `onFatalError` 让你观察失败情况 或者让自己恢复 两次失败没有显示面板 。 一个是嵌入式终端 上面的目标不见了 另一个是文件的第二个终端,它已经持有一个活的. 进程退出的会话会显示“ 会议结束” 而不重新连接 。 如果您在下一个连接上给出了新的会话, 请打电话 `reattach()` 从 `onSessionEnded`并绑起你的背书. [启动失败并结束会话](https://npmcn.com/package/%40cplieger/web-terminal-ui/docs/failure-handling.md) 有细节. ## 安保和储存 图书馆没有自己的登录. 认证和来源检查属于为WebSocket和会话API服务的服务器. 粘贴会读取需要安全上下文的 Clippboard API,因此服务于 HTTPS 上的页面来触摸粘贴. Scrollback的持久性默认关闭,因为打开它会将终端输出写入浏览器存储. 打开的分页视图最多可维持两个WebSocket连接,每个显示的窗格一个. ## 相关项目 - [网络终端引擎](https://github.com/cplieger/web-terminal-engine) 是 Go 会话引擎和 TypeScript 渲染器. - [网络终端服务器](https://github.com/cplieger/web-terminal-server) 是一个随时可以运行的容器,在HTTP和WebSocket上为UI服务,用于任何命令. - [网络终端基罗](https://github.com/cplieger/web-terminal-kiro) 通过此 UI 服务浏览器中的 Kiro CLI, 作为完整页面 . - [马约特](https://github.com/cplieger/marotte) 是一个自托管的代理IDE, 将这个UI嵌入到它的外壳面板中, in `container` 设置. ## 文档 - [设置主机页面](https://npmcn.com/package/%40cplieger/web-terminal-ui/docs/host-page.md) 覆盖 CSS, 字体, 导入地图, 预设和加载覆盖 . - [选项和终端控件](https://npmcn.com/package/%40cplieger/web-terminal-ui/docs/configuration.md) 列出每个选项和主题符号. - [标签、活性点和通知](https://npmcn.com/package/%40cplieger/web-terminal-ui/docs/tabs.md) 描述标签预设显示的内容. - [分割视图](https://npmcn.com/package/%40cplieger/web-terminal-ui/docs/split-view.md) 并肩盖上两个相片. - [在重新装入时保持回滚](https://npmcn.com/package/%40cplieger/web-terminal-ui/docs/scrollback-persistence.md) 涵盖 `persistScrollback` 选项. - [启动失败并结束会话](https://npmcn.com/package/%40cplieger/web-terminal-ui/docs/failure-handling.md) 覆盖重装面板 `reattach()`。 。 。 . - [键盘、鼠标和触摸输入](https://npmcn.com/package/%40cplieger/web-terminal-ui/docs/input.md) 覆盖焦点、粘贴和鼠标报告. ## 贷项 IME 模块遵循 [x 任期.js](https://github.com/xtermjs/xterm.js)是因为 `CompositionHelper`。在电话中,制表器的闪烁阈值 [@ use- gesture (英语)](https://github.com/pmndrs/use-gesture)拖动默认值,五秒构成闲置绑定来自 [板块](https://github.com/ianstormtaylor/slate)'Android 输入管理器. [第三次议会 NoTICES.md](https://npmcn.com/package/%40cplieger/web-terminal-ui/THIRD_PARTY_NOTICES.md) 指定每行后面的行. ## 捐款 欢迎提出问题和拉动请求。 见 [捐款额](https://npmcn.com/package/%40cplieger/web-terminal-ui/CONTRIBUTING.md)。 。 。 . ## 免责声明 这个项目是精心设计的,遵循安全最佳做法,但打算供个人/自发使用。 不保证生产环境的适宜性. 自己冒险使用. 这个项目是在大赦国际的协助下建立的。 人类维护者定义建筑,监督执行,并作出所有最终决定. ## 许可证 MPL-2.0. 见 [自由主义](https://npmcn.com/package/%40cplieger/web-terminal-ui/LICENSE)。 。 。 . 这个 `Web Terminal Glyphs` 以下列方式命名的平面覆盖 `css/page.css` 是一个单独的Apache-2.0作品,它的许可证与FONT FILE一起旅行,而这个包不运送. 它只命名了 URL 。 因此,没有新的义务落在npm或JSR消费者身上. 义务是服务主机, 这就是为什么整页主机笔记在 [设置主机页面](https://npmcn.com/package/%40cplieger/web-terminal-ui/docs/host-page.md) 询问字体 `LICENSE` 财务报告和审定财务报表 `NOTICE` 旁边 `.woff2`。 。 。 . 第三方的归属 [第三次议会 NoTICES.md](https://npmcn.com/package/%40cplieger/web-terminal-ui/THIRD_PARTY_NOTICES.md)。 。 。 . ## 常见问题 ### @cplieger/web-terminal-ui 是什么？ @cplieger/web-terminal-engine的参考触摸第一浏览器UI:可相容的内核\+功能模块\(tabs,活性显示器,移动工具栏,上下文菜单,IME,预测回声,取景口处理\)和CSS\. 一个创建 Terminal \(\) 呼叫 \. ### 如何安装 @cplieger/web-terminal-ui？ 在项目目录运行 npm install @cplieger/web-terminal-ui，或使用 pnpm add / yarn add / bun add。它还需要宿主项目提供 peer 依赖：@cplieger/web-terminal-engine（^6\.5\.0）。npm 7 及以上与 pnpm 8 及以上默认会自动安装必需的 peer 依赖，Yarn 需要手动安装。 ### @cplieger/web-terminal-ui 支持 TypeScript 吗？ 支持。包内自带 TypeScript 类型声明（package\.json 声明了 types 入口），安装后即可获得类型提示，无需再安装 @types 包。 ### @cplieger/web-terminal-ui 支持 ESM 还是 CommonJS？ 以 ES Module 形式发布，推荐使用 import 引入。在 CommonJS 项目中，Node\.js 20\.19\+ / 22\.12\+ 可以直接 require\(\) 不含顶层 await 的 ES Module，更早的版本需要改用动态 import\(\)。 ### @cplieger/web-terminal-ui 可以商用吗？ @cplieger/web-terminal-ui 使用 MPL-2\.0 许可。弱 Copyleft：可以商用，也可以和闭源代码一起使用；但如果分发时修改了 MPL 授权的文件，这些文件的修改需以 MPL 开源。以上为概括，不构成法律意见，请以许可原文为准。 ### @cplieger/web-terminal-ui 的下载量有多少？ 根据 npm 官方下载统计，@cplieger/web-terminal-ui 在 2026/10/11 – 2026/11/09 这 30 天内被下载 10,372 次，日均约 346 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入，适合横向比较热度，不能直接等同于使用人数。 ### @cplieger/web-terminal-ui 还在维护吗？ 最新版本 9\.0\.0 发布于 2026/11/13（今天）；至今共发布 126 个版本，其中过去 12 个月发布了 126 个；首次发布于 2026/06/29。发布频率只是参考信号：功能稳定的工具可能很少需要更新，建议结合源码仓库的 issue 和提交记录判断。