• Stars
    star
    651
  • Rank 69,175 (Top 2 %)
  • Language
    JavaScript
  • License
    MIT License
  • Created about 5 years ago
  • Updated 6 months ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

:electron: GitHub Action for building and releasing Electron apps

Electron Builder Action

GitHub Action for building and releasing Electron apps

This is a GitHub Action for automatically building and releasing your Electron app using GitHub's CI/CD capabilities. It uses electron-builder to package your app and release it to a platform like GitHub Releases.

GitHub Actions allows you to build your app on macOS, Windows and Linux without needing direct access to each of these operating systems.

Setup

  1. Install and configure electron-builder (v22+) in your Electron app. You can read about this in the project's docs or in my blog post.

  2. If you need to compile code (e.g. TypeScript to JavaScript or Sass to CSS), make sure this is done using a build script in your package.json file. The action will execute that script before packaging your app. However, make sure that the build script does not run electron-builder, as this action will do that for you.

  3. Add a workflow file to your project (e.g. .github/workflows/build.yml):

    name: Build/release
    
    on: push
    
    jobs:
      release:
        runs-on: ${{ matrix.os }}
    
        strategy:
          matrix:
            os: [macos-latest, ubuntu-latest, windows-latest]
    
        steps:
          - name: Check out Git repository
            uses: actions/checkout@v1
    
          - name: Install Node.js, NPM and Yarn
            uses: actions/setup-node@v1
            with:
              node-version: 10
    
          - name: Build/release Electron app
            uses: samuelmeuli/action-electron-builder@v1
            with:
              # GitHub token, automatically provided to the action
              # (No need to define this secret in the repo settings)
              github_token: ${{ secrets.github_token }}
    
              # If the commit is tagged with a version (e.g. "v1.0.0"),
              # release the app after building
              release: ${{ startsWith(github.ref, 'refs/tags/v') }}

Usage

Building

Using this the workflow above, GitHub will build your app every time you push a commit.

Releasing

When you want to create a new release, follow these steps:

  1. Update the version in your project's package.json file (e.g. 1.2.3)
  2. Commit that change (git commit -am v1.2.3)
  3. Tag your commit (git tag v1.2.3). Make sure your tag name's format is v*.*.*. Your workflow will use this tag to detect when to create a release
  4. Push your changes to GitHub (git push && git push --tags)

After building successfully, the action will publish your release artifacts. By default, a new release draft will be created on GitHub with download links for your app. If you want to change this behavior, have a look at the electron-builder docs.

Configuration

Options

You can configure the action further with the following options:

  • package_root: Directory where NPM/Yarn commands should be run (default: ".")
  • build_script_name: Name of the optional NPM build script which is executed before electron-builder (default: "build")
  • skip_build: Whether the action should execute the NPM build script before running electron-builder
  • use_vue_cli: Whether to run electron-builder using the Vue CLI plugin instead of calling the command directly
  • args: Other arguments to pass to the electron-builder command, e.g. configuration overrides (default: "")
  • max_attempts: Maximum number of attempts for completing the build and release step (default: 1)

See action.yml for a list of all possible input variables.

Code Signing

If you are building for macOS, you'll want your code to be signed. GitHub Actions therefore needs access to your code signing certificates:

  • Open the Keychain Access app or the Apple Developer Portal. Export all certificates related to your app into a single file (e.g. certs.p12) and set a strong password
  • Base64-encode your certificates using the following command: base64 -i certs.p12 -o encoded.txt
  • In your project's GitHub repository, go to Settings → Secrets and add the following two variables:
    • mac_certs: Your encoded certificates, i.e. the content of the encoded.txt file you created before
    • mac_certs_password: The password you set when exporting the certificates

Add the following options to your workflow's existing action-electron-builder step:

- name: Build/release Electron app
  uses: samuelmeuli/action-electron-builder@v1
  with:
    # ...
    mac_certs: ${{ secrets.mac_certs }}
    mac_certs_password: ${{ secrets.mac_certs_password }}

The same goes for Windows code signing (windows_certs and windows_certs_password secrets).

Snapcraft

If you are building/releasing your Linux app for Snapcraft (which is electron-builder's default), you will additionally need to install and sign in to Snapcraft. This can be done using an action-snapcraft step before the action-electron-builder step:

- name: Install Snapcraft
  uses: samuelmeuli/action-snapcraft@v1
  # Only install Snapcraft on Ubuntu
  if: startsWith(matrix.os, 'ubuntu')
  with:
    # Log in to Snap Store
    snapcraft_token: ${{ secrets.snapcraft_token }}

You can read here how you can obtain a snapcraft_token.

Notarization

If you've configured electron-builder to notarize your Electron Mac app as described in this guide, you can use the following steps to let GitHub Actions perform the notarization for you:

  1. Define the following secrets in your repository's settings on GitHub:

    • api_key: Content of the API key file (with the p8 file extension)
    • api_key_id: Key ID found on App Store Connect
    • api_key_issuer_id: Issuer ID found on App Store Connect
  2. In your workflow file, add the following step before your action-electron-builder step:

    - name: Prepare for app notarization
      if: startsWith(matrix.os, 'macos')
      # Import Apple API key for app notarization on macOS
      run: |
        mkdir -p ~/private_keys/
        echo '${{ secrets.api_key }}' > ~/private_keys/AuthKey_${{ secrets.api_key_id }}.p8
  3. Pass the following environment variables to action-electron-builder:

    - name: Build/release Electron app
      uses: samuelmeuli/action-electron-builder@v1
      with:
        # ...
      env:
        # macOS notarization API key
        API_KEY_ID: ${{ secrets.api_key_id }}
        API_KEY_ISSUER_ID: ${{ secrets.api_key_issuer_id }}

Example

For an example of the action used in production (including app notarization and publishing to Snapcraft), see Mini Diary.

Development

Suggestions and contributions are always welcome! Please discuss larger changes via issue before submitting a pull request.

Related

More Repositories

1

mini-diary

📘 Simple and secure journal app
TypeScript
1,031
star
2

glance

🔎 All-in-one Quick Look plugin
Swift
953
star
3

tmignore

🕔 Exclude development files from Time Machine backups
Swift
322
star
4

font-picker

✏️ Font selector component for Google Fonts
TypeScript
171
star
5

font-picker-react

✏️ Font selector component for Google Fonts
TypeScript
152
star
6

react-magnifier

🔍 React image zoom component
TypeScript
151
star
7

action-maven-publish

📦 GitHub Action for automatically publishing Maven packages
JavaScript
101
star
8

lyrics-poster

🎤 Create posters of your favorite artists, written in their lyrics
JavaScript
63
star
9

refind-theme-dark

🎨 A simple, dark theme for rEFInd
54
star
10

action-snapcraft

🐦 GitHub Action for setting up Snapcraft
JavaScript
49
star
11

font-manager

🗂 Manages, downloads and applies Google Fonts for picker components
TypeScript
27
star
12

swift-exec

🚀 Simple process execution with Swift
Swift
16
star
13

draft-js-list-plugin

📝 Better lists for Draft.js
TypeScript
14
star
14

python-wikibase

🤖 Wikibase queries and edits made easy
Python
11
star
15

nbtohtml

📈 Convert Jupyter Notebook files to HTML
Go
9
star
16

github-downloads

⬇️ See the number of downloads next to releases on GitHub
JavaScript
8
star
17

alfred-system-theme

🎨 Alfred themes in style of Apple's macOS apps
7
star
18

react-library-boilerplate

🔨 Create a React component library with no configuration
JavaScript
6
star
19

iconsets.org

🌟 Icon set discovery website for designers
JavaScript
5
star
20

wikibase-api

📦 Wrapper library for the Wikibase API
Python
4
star
21

anonymize-ip

👤 Python library for anonymizing IP addresses
Python
4
star
22

strava-bulk-edit

🏃 Edit multiple Strava activities at once
Go
2
star
23

electron-md-to-pdf

:electron: Convert Markdown to PDF in Electron apps
CSS
2
star
24

hugo-starter-theme

🔨 Boilerplate for building a custom Hugo theme
HTML
2
star
25

samuelmeuli.com

👨‍💻 My personal website
CSS
1
star
26

music-notifications

🎵 Notification service for new releases on iTunes
JavaScript
1
star
27

prettier-config

☑️ My Prettier configuration
JavaScript
1
star
28

react-app-boilerplate

🔨 Create a React application with no configuration
JavaScript
1
star