How to require('electron') when script is loaded by system.js

Question

I'm trying to use Aurelia and SystemJs within an electron app;

I have a fairly basic app-window.js:

const remote = require('electron').remote;

document.getElementById("close-btn").addEventListener("click", function (e) {
  var window = remote.getCurrentWindow();
  window.close();
});

...

if I consume it as normal html script (<script src="app-window.js"></script>) it works perfectly fine.

However, if I have systemJS import it:

<script>
    System.import('app-window.js');
</script>

I get the error:

system.js:4 GET file:///D:/Code/aurelia-electron-typescript/output/electron.js net::ERR_FILE_NOT_FOUND

Also I have transpiler: false set in the config too.

Unfortunately I would like to have my cake and eat it as I'd like to mingle Aurelia's dependency injection with electron's remoting features.

Is there a way to have system.js not meddle with electron's require?

Answer 1

After a quick experiment... it would appear if the script explicitly loads up with System, it magically works:

typescript:

export class AppWindow
{  
  constructor()
  {
    var remote = require('electron').remote;

    document.getElementById("close-btn").addEventListener("click", function (e) {
      var window: Electron.BrowserWindow = remote.getCurrentWindow();
      window.close();
    });
  }
}
var appWindow:AppWindow = new AppWindow()

which when compiled to [es6, System]:

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

...works perfectly fine.