Packaging Electron Applications for OSX

I want to use Electron to create installable apps for OSX, Precise, and Trusty. I first attempted to use fpm (package distribution across multiple platforms) which works fine for creating rpm and deb packages, but creating the OSX pkg file proved difficult. These steps will summarize how to create an installable .pkg from an Electron Application.

NOTE: This tutorial does not cover creating valid packages for the mac app store, which has a whole different set of requirements. But you will end up with a .pkg file which can be distributed and used to install your application.

I. Re-Branding Electron

Unless you want your Application to be named "Electron" after its installation, you will probably want to rename the application and change the default icon. On OSX, this is done by editing the existing Info.plist file in the Electron.app directory and changing four values to match your Apps name.

The Location of the Electron Info.plist file is found under the Electron.app/ directory. Navigate to that directory and use a tool such as plutil to edit the plist file. You will need to change to following fields: CFBundleIdentifier, CFBundleDisplayName, CFBundleName, CFBundleIconFile.

plutil -replace CFBundleIdentifier -string <new_bundle_id> <path_to_Info.plist>

plutil -replace CFBundleDisplayName -string <new_bundle_display_name> <path_to_Info.plist>

plutil -replace CFBundleName -string <new_bundle_name> <path_to_Info.plist>

plutil -replace CFBundleIconFile -string <new_bundle_icon_file> <path_to_Info.plist>


After this make sure the value of <new_bundle_icon_file> is an .icns file that is present in "Electron.app/Contents/Resources". If this file is not present after your app is installed it will have to default icon instead of your apps customized version.

II. Building a plist with pkgbuild

pkgbuild is used to create component packages which is a building block for product archives (a bundled set of component packages which is usually the package that is installed). However our goal here is to QUICKLY create a .pkg which can be used to install our app, and creating a component package will be the fastest way to do that.

All OSX packages require a plist Property list file, which contains default configuration values for your app. Running pkgbuild in "--analyze" mode will create this plist file from your already existing Electron Application.

sudo pkgbuild --analyze --root <path_to_app_directory>.app <resulting_plist_name>.plist

The plist file is then used to create a installable .pkg file

sudo pkgbuild --root <path_to_app_directory>.app --component-plist <resulting_plist_name>.plist --identifier <package_identifier> --install-location <installation_destination> <package_name>.pkg

1) <package_name>.pkg: Name of the output .pkg file
2) <installation_destination>: /Applications
3) <resulting_plist_name>.plist: The plist generated from the pkgbuild --analyze command
4) <package_identifier>: Whatever you want your packaged to be named "com.mycompany"

You can now use the resulting .pkg file to install your new application!!!