babel-plugin-jsm-to-esmodules
v0.6.0
Published
Transforms imports and exports in Firefox .jsm to ES module syntax
Downloads
34
Readme
JSM to ES Module Babel Plugin
This module converts import and export statements in .jsm
modules to ES modules. For example:
Source:
const {utils: Cu} = Components;
const {Bar, Baz} = Cu.import("resource://activity-stream/addon/barbaz.jsm", {});
function Stuff() {
return 123;
}
this.Whatever = {};
this.Stuff = Stuff;
var EXPORTED_SYMBOLS = ["Stuff", "Whatever"];
Compiles to:
import {Bar, Baz} from "addon/barbaz.js";
export function Stuff() {
return 123;
}
export var Whatever = {};
Caveats / Limitations
Use top-level imports and exports only
Because import
and export
statements in ES modules must be statically analyzable, this plugin will only transform
top level Cu.import
/ EXPORTED_SYMBOLS
. Example:
Good:
const {utils: Cu} = Components;
const {Bar} = Cu.import("resource://foo/Bar.jsm", {});
this.Baz = 123;
this.EXPORTED_SYMBOLS = ["Baz"];
Bad:
const {utils: Cu} = Components;
const root = this;
function innerFunction() {
// This won't get converted because it's inside innerFunction
const {Bar} = Cu.import("resource://foo/Bar.jsm", {});
// Don't do this either
root.Baz = 123;
}
var EXPORTED_SYMBOLS = ["Baz"];
Don't alias this
or dynamically add items to var EXPORTED_SYMBOLS
when exporting
You should only declare this.EXPORTED_SYMBOLS
once in the top-level scope, and it should not be modified.
Good:
function Foo() {...}
this.Foo = Foo;
this.Bar = 123;
this.EXPORTED_SYMBOLS = ["Foo", "Bar"];
Bad:
const root = this;
const Foo = 123;
root.EXPORTED_SYMBOLS = ["Foo"]; // Don't alias this when exporting
root.Bar = 456;
root.EXPORTED_SYMBOLS.push("Bar"); // Don't do this
Don't reassign Components.utils.import
Assigning variables to Components
or Components.utils
is OK, but don't assign the .import
;
const C = Components; // OK
const {utils: Cu} = Components; // OK
const u = Components.utils // OK
const {import} = Cu; // Don't do this
const i = Components.utils.import // Don't do this
Options
basePath
Defaults to /^resource:\/\/
. A RegEx or String that tests for which import paths to rewrite.
replace
Defaults to false
. Remove the basePath
component of the import string?
e.g. If the basePath is /^resource:\/\/
, resource://activity-stream/foo.js
will be rewritten to activity-stream/foo.js
.
"plugins": ["transform-react-jsx", {basePath: "resource://activity-stream/"}],
removeOtherImports
Defaults to false
. Should we remove non-matching imports?