How to deploy an Electron app as an executable or installable in Windows?

WindowsDeploymentDesktop ApplicationElectron

Windows Problem Overview


I want to generate a unique .exe file to execute the app or a .msi to install the application. How to do that?

Windows Solutions


Solution 1 - Windows

You can package your program using electron-packager and then build a single setup EXE file using InnoSetup.

Solution 2 - Windows

Since most answers dont have step by step instructions on packaging, let me post how i got to package the electron app.

We will be installing electron-packager first.

> Electron Packager is a command line tool and Node.js library that > bundles Electron-based application source code with a renamed Electron > executable and supporting files into folders ready for distribution.

Install electron-packager : run following command in windows cmd

npm install -g electron-packager --save-dev

Next, lets package our app for windowsx64:

electron-packager appdirectory appName --platform=win32 --arch=x64 --electron-version=1.4.3

Solution 3 - Windows

2020 Update You can use electron-builder to create portable .exe file for your electron app. All you need to do is install electron-builder with yarn add electron-builder --dev Then create a package.json file like this(this is just for portable .exe):

{
  "name": "my-electron-app",
  "productName": "electron app",
  "version": "1.0.0",
  "description": "an electron app",
  "main": "main.js",
  "scripts": {
    "start": "electron .",
    "dist": "electron-builder"
  },
  "devDependencies": {
    "electron": "^8.0.2",
    "electron-builder": "^22.3.2"
  },
  "build": {
    "appId": "com.electron.app",
    "win": {
      "target": "portable"
    },
    "portable": {
      "unicode": false,
      "artifactName": "my_electron_app.exe"
    }
  }
}

Solution 4 - Windows

You can also try with the electron-boilerplate. Which has 'release' task of gulp and it will create single ready to go executable file for all cross platform. You only need to build application from all three platform to generate particular platform executable.So you don't need to install any third party tool.

Solution 5 - Windows

To package the electron app as installable or executable. electron-builder should be the best choice. And it's easy to configure and we can use electron auto-updater too. Here is the example of electron-builder.json

{
  "publish": {
    // This can be also 's3', 'github'... based on which server you are using for publish
    // https://www.electron.build/configuration/publish
    "provider": "generic",

    // Feed URL but github provider case, other fields will be required. 'repo', 'owner'...
    "url": "https://myappserver.com/updates/"
  },

  "productName": "My App",
  "appId": "com.myapp.app",

  "directories": {
    // The icon and background in 'buildResources' will be used as app Icon and dmg Background
    "buildResources": "buildResources",

    // output is directory where the packaged app will be placed
    "output": "release"
  },

  // The files which will be packed
  "files": ["src/", "node_modules/", "package.json"],

  "mac": {
    "target": ["dmg", "zip"], // Also can be, 'pkg', ...
    "artifactName": "${productName}-${version}-${os}.${ext}"
  },
  "win": {
    "target": ["nsis", "zip"], // Also can be, 'portable', ...
    "artifactName": "${productName}-${version}-${os}.${ext}"
  },
  "linux": {
    "target": ["AppImage"],
    "artifactName": "${productName}-${version}-${os}.${ext}"
  },
  "dmg": {
    "title": "${productName}-${version}",
    "contents": [
      {
        "x": 300,
        "y": 360
      },
      {
        "x": 490,
        "y": 360,
        "type": "link",
        "path": "/Applications"
      }
    ]
  }
}

Of course, we can add other configurations such as nsis, extraFiles, afterPack, afterSign...

The above are well-used. You can check details and other fields at here https://www.electron.build/configuration/publish

We can define this configuration at the inside of package.json or as an isolated file but the name should be electron-builder.json or electron-builder.yml at the project root directory.

And in addition, for auto-update. We should upload the installers(dmg, exe, appImage) among with zip, blockmap and latest-{OS_Name}.ymlfiles.

Solution 6 - Windows

There are so many good modules which generate single installer *exe file. Check out any of these:

  • electron-builder (genrates executable for Windows,Mac and Linux, have server-less app auto-update feature,code signing, publishing etc, less boilerplate)

  • electron-forge (genrates executable for Windows,Mac and Linux, it not just package apps but helps you create them as well, more boilerplate)

  • windows-installer (easy to use, light weight, and generates only exe file)

(still confused which one to pick? compare here)

Solution 7 - Windows

npm install -g electron-packager --save-dev
npx electron-packager <appDirectory> appName --platform=win32 --arch=x64
npx electron-packager <appDirectory> appName --overwrite --asar --electron-version=13.4.0 --platform=win32 --arch=x64 --prune=true --out=release-builds --icon=./build/icon.ico"

Solution 8 - Windows

well ... this will work but the idea is to run the .exe without need of install it in the pc ... another solution is use Autoplay media Studio for wrap you package generated by electron and make one executable or other solution is to use thinstall vmware... The cons both are commercial so you have to paid for them...

Solution 9 - Windows

This worked for me in 2021/2022:

  1. Install Electron Packager globally. Run the following command in command prompt

npm install electron-packager -g

  1. Run the following command in command prompt:

electron-packager D:\sample MySample --platform=win32 --arch=x64

The above command shows the following output:

Packaging app for platform win32 x64 using electron v16.0.5

After 5-10 minutes, it creates the folder with the necessary files and shows the following output in the screen:

Wrote new app to D:\sample\MySample-win32-x64

The above output directory in my case was 1.09 GB in size. So ensure that you have enough space in your hard drive before you run the command mentioned in the 2nd point above.

  1. If you navigate to the above directory, you will see the following EXE file in it:

MySample.exe

Double clicking on the MySample.exe will launch the file with the app ready for your use. Also note that it will work on localhost. So enjoy!

Solution 10 - Windows

There's a lot of solutions, I recommend using the 3rd option but these are all the ones I know

  1. Use electron-packager

  2. Use electron-forge

  3. Try this: https://stackoverflow.com/a/69807948/15233276

Solution 11 - Windows

I first tried the electron-packager but it produced a lot of .dll files and still could not run.

What did work for me was:

npm install
npm run dist --ia32

This produced a single self contained exe, no other files needed to run the application.

Solution 12 - Windows

You might be able to "wrap" the entire electron app in a .NET project. Then the single executable that it creates can then just "internally" run the electron app.

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionAmiradoView Question on Stackoverflow
Solution 1 - WindowsAlex WarrenView Answer on Stackoverflow
Solution 2 - WindowsTharifView Answer on Stackoverflow
Solution 3 - WindowspanbakView Answer on Stackoverflow
Solution 4 - WindowsAnavar BharmalView Answer on Stackoverflow
Solution 5 - WindowstpikachuView Answer on Stackoverflow
Solution 6 - WindowsGorvGoylView Answer on Stackoverflow
Solution 7 - WindowsOsei-OwusuView Answer on Stackoverflow
Solution 8 - WindowsWilmar BarbView Answer on Stackoverflow
Solution 9 - WindowsDevnerView Answer on Stackoverflow
Solution 10 - WindowsShaurya ChhabraView Answer on Stackoverflow
Solution 11 - Windowsnivs1978View Answer on Stackoverflow
Solution 12 - Windowsselanac82View Answer on Stackoverflow