Snapcraft Guide (Linux)

This guide provides information on how to package your Electron application for any Snapcraft environment, including the Ubuntu Software Center.

Background and Requirements

Together with the broader Linux community, Canonical aims to fix many of the common software installation problems with the snapcraft project. Snaps are containerized software packages that include required dependencies, auto-update, and work on all major Linux distributions without system modification.

There are three ways to create a .snap file:

1) Using Electron Forge or electron-builder, both tools that come with snap support out of the box. This is the easiest option. 2) Using electron-installer-snap, which takes electron-packager‘s output. 3) Using an already created .deb package.

In some cases, you will need to have the snapcraft tool installed. Instructions to install snapcraft for your particular distribution are available here.

Using electron-installer-snap

The module works like electron-winstaller and similar modules in that its scope is limited to building snap packages. You can install it with:

  1. npm install --save-dev electron-installer-snap

Step 1: Package Your Electron Application

Package the application using electron-packager (or a similar tool). Make sure to remove node_modules that you don’t need in your final application, since any module you don’t actually need will increase your application’s size.

The output should look roughly like this:

  1. .
  2. └── dist
  3. └── app-linux-x64
  4. ├── LICENSE
  5. ├── LICENSES.chromium.html
  6. ├── content_shell.pak
  7. ├── app
  8. ├── icudtl.dat
  9. ├── libgcrypt.so.11
  10. ├── libnode.so
  11. ├── locales
  12. ├── resources
  13. ├── v8_context_snapshot.bin
  14. └── version

Step 2: Running electron-installer-snap

From a terminal that has snapcraft in its PATH, run electron-installer-snap with the only required parameter --src, which is the location of your packaged Electron application created in the first step.

  1. npx electron-installer-snap --src=out/myappname-linux-x64

If you have an existing build pipeline, you can use electron-installer-snap programmatically. For more information, see the Snapcraft API docs.

  1. const snap = require('electron-installer-snap')
  2. snap(options)
  3. .then(snapPath => console.log(`Created snap at ${snapPath}!`))

Using snapcraft with electron-packager

Step 1: Create Sample Snapcraft Project

Create your project directory and add the following to snap/snapcraft.yaml:

  1. name: electron-packager-hello-world
  2. version: '0.1'
  3. summary: Hello World Electron app
  4. description: |
  5. Simple Hello World Electron app as an example
  6. base: core18
  7. confinement: strict
  8. grade: stable
  9. apps:
  10. electron-packager-hello-world:
  11. command: electron-quick-start/electron-quick-start --no-sandbox
  12. extensions: [gnome-3-34]
  13. plugs:
  14. - browser-support
  15. - network
  16. - network-bind
  17. environment:
  18. # Correct the TMPDIR path for Chromium Framework/Electron to ensure
  19. # libappindicator has readable resources.
  20. TMPDIR: $XDG_RUNTIME_DIR
  21. parts:
  22. electron-quick-start:
  23. plugin: nil
  24. source: https://github.com/electron/electron-quick-start.git
  25. override-build: |
  26. npm install electron electron-packager
  27. npx electron-packager . --overwrite --platform=linux --output=release-build --prune=true
  28. cp -rv ./electron-quick-start-linux-* $SNAPCRAFT_PART_INSTALL/electron-quick-start
  29. build-snaps:
  30. - node/14/stable
  31. build-packages:
  32. - unzip
  33. stage-packages:
  34. - libnss3
  35. - libnspr4

If you want to apply this example to an existing project:

  • Replace source: https://github.com/electron/electron-quick-start.git with source: ..
  • Replace all instances of electron-quick-start with your project’s name.

Step 2: Build the snap

  1. $ snapcraft
  2. <output snipped>
  3. Snapped electron-packager-hello-world_0.1_amd64.snap

Step 3: Install the snap

  1. sudo snap install electron-packager-hello-world_0.1_amd64.snap --dangerous

Step 4: Run the snap

  1. electron-packager-hello-world

Using an Existing Debian Package

Snapcraft is capable of taking an existing .deb file and turning it into a .snap file. The creation of a snap is configured using a snapcraft.yaml file that describes the sources, dependencies, description, and other core building blocks.

Step 1: Create a Debian Package

If you do not already have a .deb package, using electron-installer-snap might be an easier path to create snap packages. However, multiple solutions for creating Debian packages exist, including Electron Forge, electron-builder or electron-installer-debian.

Step 2: Create a snapcraft.yaml

For more information on the available configuration options, see the documentation on the snapcraft syntax. Let’s look at an example:

  1. name: myApp
  2. version: '2.0.0'
  3. summary: A little description for the app.
  4. description: |
  5. You know what? This app is amazing! It does all the things
  6. for you. Some say it keeps you young, maybe even happy.
  7. grade: stable
  8. confinement: classic
  9. parts:
  10. slack:
  11. plugin: dump
  12. source: my-deb.deb
  13. source-type: deb
  14. after:
  15. - desktop-gtk3
  16. stage-packages:
  17. - libasound2
  18. - libnotify4
  19. - libnspr4
  20. - libnss3
  21. - libpcre3
  22. - libpulse0
  23. - libxss1
  24. - libxtst6
  25. electron-launch:
  26. plugin: dump
  27. source: files/
  28. prepare: |
  29. chmod +x bin/electron-launch
  30. apps:
  31. myApp:
  32. command: bin/electron-launch $SNAP/usr/lib/myApp/myApp
  33. desktop: usr/share/applications/myApp.desktop
  34. # Correct the TMPDIR path for Chromium Framework/Electron to ensure
  35. # libappindicator has readable resources.
  36. environment:
  37. TMPDIR: $XDG_RUNTIME_DIR

As you can see, the snapcraft.yaml instructs the system to launch a file called electron-launch. In this example, it passes information on to the app’s binary:

  1. #!/bin/sh
  2. exec "$@" --executed-from="$(pwd)" --pid=$$ > /dev/null 2>&1 &

Alternatively, if you’re building your snap with strict confinement, you can use the desktop-launch command:

  1. apps:
  2. myApp:
  3. # Correct the TMPDIR path for Chromium Framework/Electron to ensure
  4. # libappindicator has readable resources.
  5. command: env TMPDIR=$XDG_RUNTIME_DIR PATH=/usr/local/bin:${PATH} ${SNAP}/bin/desktop-launch $SNAP/myApp/desktop
  6. desktop: usr/share/applications/desktop.desktop