3 votes

Import modules in JavaScript

I am trying to import a module in JavaScript. In python, because it is simple, just import what you want with import.

In javascript by the looks of it also seems to be a simple. In my case, I am trying to deploy the example that comes in Using JavaScript code modules

However, I see this error in google chrome, Uncaught ReferenceError: Components is not defined. What I am doing wrong?

my_module.jsm

var EXPORTED_SYMBOLS = ["foo", "bar"];

function foo() {
  return "foo";
}

var bar = {
  name : "bar",
  size : 3
};

var dummy = "dummy";

test.js

Components.utils.import("resource://my_module.jsm");

alert(foo());         // displays "foo"
alert(bar.size + 3);  // displays "6"
alert(dummy);         // displays "dummy is not defined" because 'dummy' was not exported from the module

test.html

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title></title>
  </head>
  <body>
    <h1>hola</h1>
    <script src="test.js"></script>
  </body>
</html>

5voto

rnrneverdies Points 14752

Forget about Components, is not standard, but I propose an alternative where IF it is possible to import another JavaScript file using a standard means, this trick that I learned in the original OS:

// declaras un función que agregue el script a la cabecera del HTML
// y te notifique cuando el archivo termino de cargarse
function import(url, callback)
{
    var head = document.getElementsByTagName('head')[0];
    var script = document.createElement('script');
    script.type = 'text/javascript';
    script.src = url;
    // compatibilidad cross browser 
    script.onreadystatechange = callback;
    script.onload = callback;
    head.appendChild(script);
}

// ... así se usa

import("url/del/archivo.js", function() {
  // aqui ya se cargo el script, de forma global, como cualquier otro.
});

Almost as easy as an import in pyton, one that is asincronico :P

By the way, you also have to jQuery.getScript(), or even using Ajax to load JavaScript code.

There are ways that work in all browsers.

By the way, Components will not work in Chrome or in other browsers, is not part of the standard in force (Living standard).

That is done to jsm, which is a javascript modular, one-piece own Gecko to extend Firefox.

2voto

Alvaro Montoro Points 38554

Components is not standard and its use in web development is not recommended according to the site of Mozilla Developer Network (MDN).

Translation of the page about the object Components on MDN:

Non-standard

This feature is not standard and is not in the plans that is standard. Not for use on web pages in production: will not work for all users. There may also be numerous incompatibilities, and their behavior may change in the future.

Attention:

This object is not designed to run with privileges chrome. Expose this object to the web was a mistake. If you use this object in your web site, your page can break at any time! In the current versions of Firefox only a few interfaces required for operation are active. Don't use Components!

2voto

kiramishima Points 309

Components is not standard, however you could use ES6 and Babel + Webpack to perform imports .

HolaDevs.com

HolaDevs is an online community of programmers and software lovers.
You can check other people responses or create a new question if you don't find a solution

Powered by:

X