xterm.js README

The project's README from github.com/xtermjs/xterm.js. As one markdown file: README.md.

xterm.js

Xterm.js is a frontend component that enables applications to bring fully-featured terminals to their users in the browser. It's used by popular projects such as VS Code (and its forks), Tabby and Hyper.

Features

What xterm.js is not

Getting Started

First, you need to install the module. We ship exclusively through npm, so you need that installed and then add @xterm/xterm as a dependency by running:

npm install --save @xterm/xterm

The recommended way to load xterm.js with the ES module syntax, either using TypeScript or a modern JS tooling. Note that both CommonJS and ES module files are shipped with the npm package.

import { Terminal } from '@xterm/xterm';

Then instantiate a Terminal object, open it on an element and write to it:

const term = new Terminal();
term.open(document.getElementById('terminal'));
term.write('Hello from \x1B[1;3;31mxterm.js\x1B[0m $ ')

Most use cases will hook up input and output to a pseudoterminal API such as node-pty which will drive the terminal.

pty.onData(data => term.write(data));
term.onData(data => pty.write(data));

Then make sure to also include the css/xterm.css file, for example in HTML:

<link rel="stylesheet" href="node_modules/@xterm/xterm/css/xterm.css" />

Standalone example

Here is a complete standalone example in a HTML file:

<!doctype html>
  <html>
    <head>
      <link rel="stylesheet" href="node_modules/@xterm/xterm/css/xterm.css" />
      <script src="node_modules/@xterm/xterm/lib/xterm.js"></script>
    </head>
    <body>
      <div id="terminal"></div>
      <script>
        const term = new Terminal();
        term.open(document.getElementById('terminal'));
        term.write('Hello from \x1B[1;3;31mxterm.js\x1B[0m $ ')
      </script>
    </body>
  </html>

Addons

Addons are separate modules that extend the Terminal by building on the xterm.js API. To use an addon, you first need to install it in your project:

npm install --save @xterm/addon-web-links

Then import the addon, instantiate it and call Terminal.loadAddon:

import { Terminal } from '@xterm/xterm';
import { WebLinksAddon } from '@xterm/addon-web-links';

const terminal = new Terminal();
// Load WebLinksAddon on terminal, this is all that's needed to get web links
// working in the terminal.
terminal.loadAddon(new WebLinksAddon());

The xterm.js team maintains the following addons, but anyone can build them:

Browser Support

Since xterm.js is typically implemented as a developer tool, generally only modern evergreen browsers are supported officially. Specifically the latest versions of Chrome, Edge, Firefox, and Safari. Xterm.js also works seamlessly in Electron apps and may even work on earlier versions of the browsers. These are the versions we strive to keep working.

Node.js Support

We also publish @xterm/headless which is a stripped down version of xterm.js that runs headless in Node.js. An example use case for this is to keep track of a terminal's state where the process is running and using the serialize addon so it can get all state restored upon reconnection.

API

The full API for xterm.js is contained within the TypeScript declaration file, use the branch/tag picker in GitHub (w) to navigate to the correct version of the API.

Some APIs may be marked with experimental, these are added to enable experimentation with new ideas without committing to support it like a normal semver API. Note that these APIs can change radically between versions, so be sure to read release notes if you plan on using experimental APIs.

Releases

Stable releases are done on an as needed basis. All current and past releases are available on this repo's releases page, you can see what's planned for upcoming releases looking through the repository milestones.

Beta builds

Beta releases are continuously published off the master branch. Install the latest beta build with:

npm install --save @xterm/xterm@beta

The principal implementation (VS Code) typically uses the latest or near the latest beta build. Generally they are quite stable but can potentially contain bugs or breaking changes. If stability is very important we recommend using the beta build primarily to test out new features and to verify bug fixes, unless you're tracking what's landing and are comfortable taking that risk.

Contributing

Read CONTRIBUTING.md to learn how to contribute to the project.

Real-world uses

Xterm.js is used in many world-class applications to provide great terminal experiences.

Do you use xterm.js in your application as well? Please open a Pull Request to include it here. We would love to have it on our list. Please add any new contributions to the end of the list.

License Agreement

If you contribute code to this project, you implicitly allow your code to be distributed under the MIT license. You are also implicitly verifying that all code is your original work.

Copyright (c) 2017-2026, The xterm.js authors (MIT License)
Copyright (c) 2014-2017, SourceLair, Private Company (www.sourcelair.com) (MIT License)
Copyright (c) 2012-2013, Christopher Jeffrey (MIT License)

xterm.js (xtermjs/xterm.js)

Searching Database…

21.3K ·GitHub
这是什么东西?Xterm.js 是一个前端组件,可以让网页应用在浏览器里嵌入一个功能完整的终端。VS Code、Hyper 和 Tabby 的内置终端就是用它做的。
那它是一个装好就能用的终端,还是给开发者用的组件?它是一个 JavaScript 库,不是拿来就能用的终端应用:你需要把它嵌入自己的网页或 Electron 应用里。它也不是 shell——它只负责渲染输出和转发输入,处理的是你连接上去的进程。
我怎么把它加到项目里?从 npm 安装 @xterm/xterm 包(这是唯一的发布渠道),实例化一个 Terminal,挂载到一个 DOM 元素上,然后往里写内容。另外还要引入 css/xterm.css 样式表。
要接上真正的 shell,我还需要什么?这个库只负责渲染;输入和输出来自伪终端 API,比如 node-pty,通常由你的后端来驱动。额外的功能以独立的插件形式提供——比如 @xterm/addon-attach,可以通过 websocket 连接到运行进程的服务器。
它能跑 vim、tmux 这类真正的终端程序吗?基本上可以:bash、vim 和 tmux 都能直接用,包括基于 curses 的程序和鼠标事件,还支持中日韩文字、emoji 和输入法(IME)。搜索、图片、连字、网页字体等额外功能则通过可选插件提供。
哪些浏览器里能用?最新版的 Chrome、Edge、Firefox 和 Safari 都得到官方支持,因为它主要是作为开发者工具使用的。它也能在 Electron 应用中无缝运行,在较旧的浏览器版本上可能也能用。
它真的快吗?GPU 渲染器是干什么的?快:README 里说它非常快,还有一个可选的 GPU 加速渲染器,以 @xterm/addon-webgl 插件的形式提供,通过 canvas 的 webgl2 上下文来绘制终端。
有哪些知名应用是基于它做的?VS Code 及其分支、Hyper、Tabby、JupyterLab、Proxmox VE、Azure Cloud Shell、RStudio、Replit 和 ttyd 都用 xterm.js 来提供终端体验——它是网页应用事实上的标准终端组件。
对使用屏幕阅读器的用户来说,它的无障碍支持怎么样?它提供了可选的屏幕阅读器模式和最低对比度设置,两者都可以在终端选项里开启。
正式版稳定吗?还是该用 beta 版?正式版按需发布,而 beta 版从 master 持续构建。它们通常也是稳定的——VS Code 自己就在用接近最新的 beta 版——但可能包含破坏性改动,所以主要用来测试新功能。
What are similar projects?upterm, chalk, ttyd, terminalizer, gpu.js, kitty, lenis, tfjs
Creator
xtermjs
Size
36.5 MB
Stars
21.3K
Age
12y
Commits · 90 Days