Ionic 3 using JavaScript library xterm.js

Viewed 1222

I'm trying to use the xterm.js library for an Ionic 3 project.

Github has the source: https://github.com/aircable/ionic-xterm and instructions. It compiles and starts, but it does not show correctly, or at all. Layout is wrong.

Other problems are the loading of addons. Several of these attempts are commented out.

Here is an excerpt from home.ts

import { Component, OnInit } from '@angular/core';
import { NavController } from 'ionic-angular';

import * as Terminal from "xterm";
//import style from 'xterm/dist/xterm.css';
import "xterm/dist/addons/fit/fit";

@Component({
  selector: 'terminal',
  templateUrl: "home.html",
  //styles: [ style ]
  //styleUrls: ["./xterm.css"]
})

export class HomePage implements OnInit {

  private term: Terminal;

  constructor( public navCtrl: NavController ) {

    this.term = new Terminal( {cursorBlink: true} );
    this.term.open( document.getElementById("terminal") );

    //Terminal.loadAddon( "fit" );

    //this.term.fit();

    this.term.writeln('Welcome to xterm.js');

    // this is
    this.term.on('key', (key, ev) => {
      console.log( key );
    });

  }

  ngOnInit () {}

}
1 Answers
Related