Can this npm package be imported?

Question

Hi I am trying to import a npm package called "jquery.terminal" into my project.

I am using browserify through the command line to convert the require("jquery.terminal"); statement into readable code by the interpreter.

Here is my current code.

require("jquery.terminal");

jQuery(function($, undefined) {
    $('#term_demo').terminal(function(command) {
        if (command !== '') {
            try {
                var result = window.eval(command);
                if (result !== undefined) {
                    this.echo(new String(result));
                }
            } catch(e) {
                this.error(new String(e));
            }
        } else {
           this.echo('');
        }
    }, {
        greetings: 'JavaScript Interpreter',
        name: 'js_demo',
        height: 200,
        prompt: 'js> '
    });
});

here is the package on npm https://github.com/jcubic/jquery.terminal

Here is my error

jQuery.Deferred exception: $(...).terminal is not a function TypeError: $(...).terminal is not a function
    at HTMLDocument.<anonymous> (file:///C:/Dev/term-game/bundle.js:6:21)
    at mightThrow (file:///C:/Dev/term-game/bundle.js:11049:29)
    at process (file:///C:/Dev/term-game/bundle.js:11117:12) undefined
jQuery.Deferred.exceptionHook @ bundle.js:11333
process @ bundle.js:11121
setTimeout (async)
(anonymous) @ bundle.js:11155
fire @ bundle.js:10783
fireWith @ bundle.js:10913
fire @ bundle.js:10921
fire @ bundle.js:10783
fireWith @ bundle.js:10913
ready @ bundle.js:11393
completed @ bundle.js:11403
bundle.js:6 Uncaught TypeError: $(...).terminal is not a function
    at HTMLDocument.<anonymous> (bundle.js:6)
    at mightThrow (bundle.js:11049)
    at process (bundle.js:11117)

Have you tried adding jQuery to the global object first ? `global.jQuery = require("jquery")` then require the terminal plugin ? — Gabriele Petrioli, May 09 '18 at 08:17

jcubic · Answer 1 · 2018-05-09T12:13:20.337

0

You need to include jQuery so you have jQuery object and then jQuery Terminal also UMD jQuery Terminal use require to invoke a function and pass all dependencies to it, which in this case is just jQuery.

var $ = require('jquery');
require('jquery.terminal')($);

$('#term').terminal();

edited May 09 '18 at 12:13

answered May 08 '18 at 14:32

jcubic

61,973
54
229
402

That did not work, still receiving error. The package is exporting as a UMD module so it should work but Im still having problems with browserify. Is there an alterative? – TheHoop May 08 '18 at 23:09
@TheHoop I've updated the answer you need to execute the function returned by the plugin and pass dependencies to it, this is how that UMD work. If you want to include css file in bundle you can use webpack with css + style loaders. – jcubic May 09 '18 at 12:15

Can this npm package be imported?

1 Answers1