Building Installers for Different Platforms (Windows, macOS, Linux)

Congratulations on building your Electron application! The next crucial step is to make it accessible to your users. This involves packaging your application into an installer that's native to their operating system. Fortunately, Electron provides excellent tools to streamline this process for Windows, macOS, and Linux.

We'll primarily use a popular and powerful tool called electron-builder to handle the complexities of creating installers for various platforms. This tool supports a wide range of installer formats, including NSIS and Squirrel for Windows, DMG and Mac App Store for macOS, and AppImage, deb, and rpm for Linux.

Before we dive into the commands, make sure you have electron-builder installed as a development dependency in your project.

Next, you'll want to configure electron-builder in your package.json file. This configuration tells electron-builder how to build your application, including information about your app, target platforms, and specific builder options.

In this build object, you'll find several important properties:

• appId: A unique identifier for your application. It's crucial for updates and licensing.
• productName: The human-readable name of your application.
• directories.output: Specifies the directory where the build artifacts will be placed.
• win, mac, linux: These objects define platform-specific build configurations. Here, we've set the default target for each platform. You can specify multiple targets or customize them further.

Now, let's add scripts to your package.json to make building easy.

With these scripts in place, you can now build installers for each platform individually or for all of them with a single command. For example, to build for Windows, you would run:

Let's break down the building process for each platform, highlighting common options.

graph TD;
    A[Start: Configure electron-builder]
    B[Run: npm install --save-dev electron-builder]
    C[Add build scripts to package.json]
    D[Choose Target Platform (Windows, macOS, Linux)]
    E[Run build command (e.g., npm run build:win)]
    F[electron-builder processes your app]
    G[Generates Installer (e.g., .exe, .dmg, .AppImage)]
    H[Installer placed in output directory]
    F --> G
    G --> H
    A --> B
    B --> C
    C --> D
    D --> E
    E --> F

Building for Windows

For Windows, electron-builder supports popular installer formats like NSIS (Nullsoft Scriptable Install System) and Squirrel. NSIS is a classic choice, while Squirrel is excellent for auto-updates.

To build an NSIS installer:

You can also specify different targets in your package.json like portable for a zip file or squirrel for auto-updating installers.

Building for macOS

On macOS, the most common distribution formats are DMG (Disk Image) and the Mac App Store. DMG files are standard for direct distribution, while the Mac App Store requires a more rigorous submission process.

If you plan to distribute through the Mac App Store, you'll need to configure additional settings in your package.json related to codesigning and provisioning profiles.

The category property helps the Mac App Store classify your application.

Building for Linux

Linux offers a variety of packaging formats. electron-builder supports AppImage (a self-contained executable), deb (for Debian/Ubuntu-based systems), and rpm (for Fedora/CentOS-based systems).

AppImage is a great choice for broad compatibility as it doesn't require specific system libraries. To build an AppImage:

You can also specify multiple targets, for instance, to build both AppImage and deb packages:

Remember to consult the electron-builder documentation for advanced configurations, platform-specific icons, and deeper customization options. With these steps, you'll be well on your way to distributing your Electron application to a global audience!