How to Release Electron app for Windows or Mac or Linux system?

MD.Sazid Hasan Dip picture MD.Sazid Hasan Dip · Jan 20, 2017 · Viewed 7.7k times · Source

I have created an App With Angular 2 and I have created ios and apk file after some modification with ionic

I wanted to create desktop app file with same project

I have gone through many resources for electron but I could not get any clear idea about

how I can create an exe file from electron app file for Windows or Mac app file or Linux executable file If any one know any clear references about how I can Create an Executable file for windows or Mac or Linux by Electorn Please answer bellow

This will be very helpful for me to learn Electron

Answer

oikonomopo picture oikonomopo · May 9, 2017

App distribution example using Electron-quick-start project from official electron.atom.io page:


# Clone the Quick Start repository
$ git clone https://github.com/electron/electron-quick-start

# Go into the repository
$ cd electron-quick-start

# Install the dependencies and run
$ npm install && npm start

For application distribution we will use Electron-builder: A complete solution to package and build a ready for distribution Electron app for macOS, Windows and Linux with “auto update” support out of the box.*

From "Quick Setup Guide" section at electron-builder docs:

  1. Specify the standard fields in the application package.jsonname, description, version and author.

  2. Specify the build configuration in the package.json as follows:

    "build": { "appId": "your.id", "mac": { "category": "your.app.category.type" } }

  3. Add electron-builder at package.json (missing step from docs!):

    "devDependencies": { "electron": "1.6.6", "electron-builder": "17.1.2" }

  4. Create a directory build in the root of the project and save a background.png (macOS DMG background), icon.icns (macOS app icon) and icon.ico (Windows app icon) into it.

    The Linux icon set will be generated automatically based on the macOS icns file.

  5. Add the scripts key to the development package.json:

    "scripts": { "pack": "build --dir", "dist": "build" }

Then you can run npm run dist in your root app folder (to package in a distributable format (e.g. dmg, windows installer, deb package)). When finished, you can see that there is an appropriate installer at app/dist folder!