Electron Development Kit

Easily Test, Build and Distribute Electron Apps.

Installation

• Install the dependencies. Node and NPM are required.

npm install
# Use -g for global use from CLI
npm install electron-packager -g
# electron-packager is recommended globally.
npm install electron-prebuilt -g
# electron-prebuilt is required globally.
npm install electron-packager-interactive -g
# electron-packager-interactive is required globally to use 'npm run build:options'

This will install the following:

• electron-prebuilt - "Install electron prebuilt binaries for the command-line use using NPM."
• electron-packager - "Package and distribute your Electron app with OS-specific bundles (.app, .exe etc) via JS or CLI."
• electron-packager-interactive - "An interactive implementation of electron-packager."
• electron-builder - "Complete solution to build ready for distribution and 'auto update' Electron App installers."
  • electron-builder Options - "Custom options for the installers."

---

Open Electron App

This will open in a temporary Electron app.

npm run open

This will not create/save any .app or .exe files, it will just open your Electron file in a preview electron app.

---

Exporting for Windows & OSX

This will save your .app or .exe files into /dist/

npm run build [app name]

Remember: This will automatically overwrite your previous build files if they have the same folder name.

You can also run the following for build options that utilizes the electron-packager-interactive module.

npm run build:options

Be aware that electron-packager-interactive defaults to is an older version of Electron when exporting.

---

Creating an Installer

This will save .app, .zip (of .app) & .dmg installers into /dist/

npm run dist

Right now, you can only build Windows .exe files on Windows machines, and OSX .app / .dmg files from OSX machines. It's possible to do both from one platform, but requires some reworking of electron-builder.

---

Required Images/Icons

Be sure to look at the package.json file to see the required icons/images for building/distributing.

• build/icon.icns
• build/loading.gif
• build/background.jpg

For example, on OSX, you cannot create a DMG with electron-builder without having a background image stored in your 'build' folder.

---

Learning More About Electron

Be aware that some resources may be out of date, but the concepts remain the same.

• Packaging and Distributing Electron Desktop Apps
• Nativefier - "Wrap any web page natively without even thinking, into multi-platform apps."
• Awesome Electron - A great resource for tons of Electron projects.
• Nylas/N1 - One of the more popular apps built with Electron.
• Electron.Rocks - A frequently updated blog on all things Electron.