谁用过xterm.js这款插件?

小弟想用xterm.js 做一个连接webterminal ,看了下网上的教程,都过时了...现在最新的版本是:xterm@4.3.0 文件的路径和目录结构都变了,按照网上教程引进去直接报错了,心酸....

贴一下借鉴过的地址:

第一个

第二个

请大佬给个好看点的文档借鉴地址(except官网)

这种引入直接报错了

阅读 8.9k

xterm.js 官网地址
 xterm.js 仓库地址

从git仓库来看，xterm-addon-fit的文件机构的确有变化，您可以单独安装

npm install --save xterm-addon-fit

使用Demo

import { Terminal } from 'xterm';
import { FitAddon } from 'xterm-addon-fit';

const terminal \= new Terminal();
const fitAddon \= new FitAddon();
terminal.loadAddon(fitAddon);
terminal.open(containerElement);
fitAddon.fit();

官方demo

根据官网代码改用4.3.0版本实现链接

<!DOCTYPE html>
<html lang="en">
<head>
<script src="https://code.jquery.com/jquery-3.1.1.slim.min.js"></script>
  <link rel="stylesheet" href="https://xtermjs.org/css/main.css">
  <meta charset="UTF-8">
  <title>Document</title>
</head>
<body>
   <h2 id="demo">Demo</h2>
<div id="terminal"></div>
<link rel="stylesheet" href="https://unpkg.com/xterm@4.3.0/css/xterm.css" />
<script src="https://unpkg.com/xterm@4.3.0/lib/xterm.js"></script>
  
<script>
  $(function () {
    var term = new Terminal();
    term.open(document.getElementById('terminal'));
    function runFakeTerminal() {
        if (term._initialized) {
            return;
        }

        term._initialized = true;

        term.prompt = () => {
            term.write('\r\n$ ');
        };

        term.writeln('Welcome to xterm.js');
        term.writeln('This is a local terminal emulation, without a real terminal in the back-end.');
        term.writeln('Type some keys and commands to play around.');
        term.writeln('');
        prompt(term);

        term.onKey(e => {
            const printable = !e.domEvent.altKey && !e.domEvent.altGraphKey && !e.domEvent.ctrlKey && !e.domEvent.metaKey;

            if (e.domEvent.keyCode === 13) {
                prompt(term);
            } else if (e.domEvent.keyCode === 8) {
                // Do not delete the prompt
                if (term._core.buffer.x > 2) {
                    term.write('\b \b');
                }
            } else if (printable) {
                term.write(e.key);
            }
        });
    }

    function prompt(term) {
      term.write('\r\n$ ');
    }
    runFakeTerminal();
});
</script>
</body>
</html>

谁用过xterm.js这款插件?

你尚未登录，登录后可以

js 如何将Key属性相同的放在同一个数组？

为什么在谷歌浏览器中 'a' == ['a'] 返回 true？

vue项目如何在初始化之前跳转外部页面？

js如何控制移动端overflow:scroll容器滑动的最大速度？

前端代码更新如何通知用户刷新页面？

纯css如何绘制一个无背景色有边框色，带有文字的倒等腰梯形？

请问zustand的slice里面的属性，如何配置TypeScript类型约束？