We’ve created a large closed-source Electron app using Aurelia with jspm/SystemJS. I also hang around on the Electron Slack channel so have a good idea of the pitfalls whichever way you’re approaching it.
As far as we’ve worked out, in Electron there are two types of dependencies. Firstly, there are dependencies that work in the browser or those which are pure JavaScript. These can be safely bundled using your choice of build system and just work.
Everything else fits into the second category. This includes native modules (ie. those written in C/C++) for example node-serialport, ffi, usb-detection, etc and modules which include binaries or scripts which can’t be bundled (sudo-prompt is a good example of this). Modules in this second category have to be installed in node_modules using yarn add/npm install. This is especially important for native modules so electron-rebuild can pick them up and build them against the version of Electron you’re targeting. Some native modules come prebuilt for various platforms and others you’ll need node-gyp working for the rebuild to complete successfully.
How do you load from these two locations?
SystemJS
For SystemJS this is quite simple. For basic JavaScript libraries you load them like you would outside of electron and they’re pulled from your bundle in production:
import math from 'mathjs';
To load the dependencies in node_modules you have to hit electrons node require method which can be done in two ways:
// The obvious way
const serialPort = require('serialport');
// The 'special' systemjs way
import { serialPort } from '@node/serialport';
To get TypeScript typings working with the second option you’ll probably have to create some type definitions to help the compiler out:
declare module '@node/serialport' {
import sp = require('serialport');
export = sp;
}
RequireJS
As far as I understand, RequireJS is the default loader with the Aurelia CLI. This poses some problems because its require method clashes with the electron node one.
Some older electron issues seem to suggest that requirejs is not supported at all. I’m sure there are ways to get it working but the recommendation is to just not use RequireJS at all.
Webpack
The Electron Slack channel is littered with posts asking how to get Webpack working with Electron and this is probably simply because Webpack config is complex enough without having to cater for the two runtimes in Electron.
I have no idea how to get it working but it might be worth looking at electron-webpack and the examples.
Other miscellaneous points
- TypeScript projects with the latest versions of Electron should target
esnext. These newer versions of Electron have native support for async/await which is measurably faster than the ES5/ES6 generated code.
- I’m guessing there is an equivalent output for JavaScript projects?
-
Spectron is the easiest way to do e2e tests
- Karma tests can be run in karma-electron so your test are run in the same environment as production
- I’ll add more if I think of any…
)
I’m not sure why you felt you needed to respond that way. Prior to the question, which is a legitimate question, I did test out UniteJS as someone above did (Already confirmed before I even tested it myself). So tasks 1 and 2 are done. I guess I’m doing alright???