开发准备
身为一个前端童鞋,之前网上xterm的资料,好多都太坑了,竟然不说环境的问题,简直不能忍啊
-
npm install --global windows-build-tools
或者yarn global add windows-build-tools
- 安装时候,
cmd
或者Powershell
一定一定要一管理员身份运行 -
安装的时候一定要多等一会儿,彻底等他安装完,我先用yarn装了,后来不会动了,我以为装好了,就停了,用的时候报错,又用npm装,装好之后,以后下包的时候老是报错,所以这个写完的时候,我就准备重置电脑了,哎,真的是坑,报错如下
- 这个就是为了装vsc++的编译环境和python的环境,不然后面是没法进行的
- 安装时候,
-
装一下
node-pty
和node-gyp
试一下,看能装不能-
node-gyp
- Node.js原生插件构建工具 -
node-pty
这是伪终端
-
-
xterm.js
默认的是Node.js
做服务,然后前后台通信需要Socket来建立连接,所以就借用一下Coding的架构图吧
通过上面的图可以看出,整个terminal组件从前端到后台的实现当中,大概要做一下几个东西:- 在浏览器端实现的终端模拟器(前端)
- 前后端建立WebSocket连接,保证用户的输入能够实时推送到后端和后端的反馈相应到前端(协议)
- 后端创建pty对,来与终端模拟器以及shell通讯(后端)
-
然后就可以愉快的进行额
-
xterm.js
的githubclone
代码 -
npm i
安装依赖 -
npm start
运行项目,如图所示
-