Making an Electron App with Ember JS Part #3: Linux

This article is part of a series. Check the links below if you haven't already!

This is part three in the series of blog posts “Making an Electron App with Ember JS” where I go over how I built my app Snipline for the web, Mac, Windows, and Linux.

This post assumes you’ve read the previous chapters, if you haven’t then I highly recommend you do.

Building for Linux

Building for Linux can be tricky. You have to take into account the following:

Unfortunately it's not possible to go through every single combination. In this post we'll be focusing on building a .deb package for Debian based distros such as Ubuntu which can be downloaded and installed via the web.

Building for Debian

A debian package is a file that can be easily downloaded from the internet, it's very easy to set up and it's relatively easy for users to install. The downside is that to update the users will need to download the latest package manually.

The upside of building .deb packages is that you can do this from any Debian based distro or even from MacOS with a couple of dependencies installed.

Requirements

Unlike the MacOS or Windows builds, you don't need to use Debian to build for Debian. If you're on MacOS you need to install the following dependencies via Homebrew.

brew install fakeroot dpkg

Update your ember-electron-forge.js to fill in the electronInstallerDebian section. Make sure to include your own applications information.

  "make_targets": {
   // ...
    "linux": [
+      "deb",
    ]
  },
  // ...
  "electronInstallerDebian": {
+    "name": "shopper",
+    "productName": "Shopper",
+    "description": "A shopping list application",
+    "productDescription": "A shopping list application",
+    "icon": "electron-assets/shopper.png",
+    "bin": 'Shopper',
+    "desktopTemplate": path.join(rootPath, "ember-electron", "resources-linux", "desktop.ejs"),
+    "categories": [
+      "Utility"
+    ],
+    "homepage": "https://github.com/snipline/shopper"
  },
  // ...

Note that capitalisation is important in this file. See how name is lower case whereas productName and bin are uppercase.

For a list of valid categories see this page.

If you've been paying attention to the code, you'll see that we need to make a "Desktop Template" (.ejs.) file in ember-electron/resources-linux/desktop.ejs. This is the contents of that file

// ember-electron/resources-linux/desktop.ejs
[Desktop Entry]
<% if (productName) { %>Name=<%= productName %>
<% } %><% if (description) { %>Comment=<%= description %>
<% } %><% if (genericName) { %>GenericName=<%= genericName %>
<% } %><% if (name) { %>Exec=<%= name %> --disable-gpu
Icon=<%= name %>
<% } %>Type=Application
StartupNotify=true
<% if (categories && categories.length) { %>Categories=<%= categories.join(';') %>;
<% } %><% if (mimeType && mimeType.length) { %>MimeType=<%= mimeType.join(';') %>;
<% } %>

The desktop.ejs file is the template for the application's .desktop file. This file takes the values we've just added to the Electron configuration and will add them to the generated Desktop file. The .desktop file then gets added to the user's local share directory when installed and makes the application available in the user's Applications menu.

Copy the icon (shopper.png) to ./electron-assets/shopper.png (Or use your own icon) so that the build will have an icon - without this the build will fail.

If you're building this on MacOS, then before running the build command, we need to update any references to process.platform to process.env.PLATFORM in the Electron configuration file. This is because even though we're building for linux with the --platform=linux flag, Node still thinks the platform is Darwin.

Finally, to build for linux run the build command below.

env PLATFORM=linux env ELECTRON_ENV=production ember electron:make --environment=production --platform=linux

That's it! You should find a .deb file in your make directory.

Nativefier

One final option for Linux, (and other Operating Systems if needed) is to use Nativefier. This essentially lets you wrap a web version of your app in Electron. The downside to this is the user needs internet access, you need to host the application online, and you get less control over other Electron settings. The upside is: it's very easy to implement and the user will always be on the latest version of your app.

Other Options

There are a lot of other options to build for Linux, including various package management systems such as apt, rpm and pacman. There's also Snapcraft, and Homebrew now supports Linux as well. Unfortunately, documentation for targeting these with Electron Forge is sparse. I'd encourage you to try them for yourself and see what you discover. Leave a comment if you get them working or even write an article! I'd love to see it.

In the next chapter we’ll take a look at building for Windows!

Spread the word

Share this article

Next up Making an Electron App with Ember JS Part #4: Windows

Like this content?

Check out some of the apps that I've built!

Snipline

Command-line snippet manager for power users

View

Pinshard

Third party Pinboard.in app for iOS.

View

Rsyncinator

GUI for the rsync command

View

Comments