Making an Electron App with Ember JS Part #3: Linux
Tags: electron, ember
Published: 2019-11-07 16:10:09

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](https://snipline.io) 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:

* What distributions do you want to support?
* What deployment channels do you wish to use?

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.

```bash
brew install fakeroot dpkg
```

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

```diff
  "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](https://standards.freedesktop.org/menu-spec/menu-spec-1.0.html#category-registry).

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

```js
// 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](https://github.com/jiahaog/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!