Aurelia: using es6 import for electron + typescript

Question

I have an aurelia application running in electron. My source files are typescript and I have ambient typings for electron and node.

Because I know I'm compiling for use on electron, I am transpiling my typescript to es6 and with System module loading; this means I can turn system.js's transpiler off. I'm using system.js and jspm because that is approach Aurelia has been pushing.

So in my ts files: I would like to be able to do:

import {remote} from 'electron';

Unfortunately, system.js does not know anything about the module electron and fails during runtime. TypeScript on the other hand is perfectly happy because I've set up the typings for electron and node; I get full intellisense in VSCode too.

note: if you attempt to do var electron = require('electron'); in the header, system.js interferes with it and it fails to load. You can place that 'require('electron')' within a class or function and it will work, but I don't find this ideal.

Question: How can I get system.js to correctly return the 'electron' module that is only available when you run the app in electron itself?

Meirion Hughes Meirion Hughes · Accepted Answer · 2016-05-20T12:03:07

A solution --hopefully there is a better way-- I've come up with is to shim the electron module for system.js and link it directly to the contents of require('electron'):

electron.js

System.register([], function (exports_1, context_1) {
    "use strict";
    var __moduleName = context_1 && context_1.id;
    var electron;
    return {
        setters: [],
        execute: function () {
            electron = require('electron');
            exports_1("default", electron);

            Object.keys(electron).forEach(function (key) {
                exports_1(key, electron[key]);
            });
        }
    }
});

this effectively wraps the internal electron module and allows system.js to know about it. It works; but hopefully there is a more elegant/built-in way that others know of.

You don't need any mappings or changes to the typescypt as import {remote} from 'electron' will attempt to resolve electron.js as a last resort.

Aurelia: using es6 import for electron + typescript

1 Answers