How to use xterm.js with Meteor

Question

I'm trying to user xterm.js in my Meteor app and I can't make it works because I got Terminal is not defined.

I use xterm like this in my client's main.html:

<script src="../imports/ui/xterm.js"></script>
        <div id="terminal"></div>
             <script>
               var term = new Terminal();
               term.open(document.getElementById('#terminal'));
               term.write('Hello from \033[1;3;31mxterm.js\033[0m $ ')
             </script>

And xterm is imported because if I take a look in the terminal I can see:

Someone has already used xterm.js with Meteor and could put me on the right track ?

Answer 1

It will not work this way. You need to import the file in your client/main.js file and use its function after:

client/main.js:

import '../imports/ui/xterm.js';

Meteor.startup(() => {
  var term = new Terminal();
  term.open(document.getElementById('#terminal'));
  term.write('Hello from \033[1;3;31mxterm.js\033[0m $ ')
});

Remember to remove the two script tag in main.html file.

Update: if it still does not work, then let move the xterm.js file to client/compatibility/xterm.js and remove the import statement in the code above.