Build App For Macos Electron

 



16 January 2020Build app for macos electronics

Icon = build/icon.icns String - The path to application icon. Entitlements String - The path to entitlements file for signing the app. Build/entitlements.mac.plist will be used if exists (it is a recommended way to set). MAS entitlements is specified in the mas. 1) Electron-builder: It is necessary to have an electron builder for your electron applications. It packages and builds the application to create “ready for distribution” applications for Windows, macOS, and Linux.

In this article I'll try to provide a step-by-step guide describing publishing of MacOS Electron.JS application to Mac App Store highlighting all tricky moments.

First of all, everything said here is relevant to the early 2020.

Design and Build electron applications that matters. Package and distribute your electron application for windows, linux and macOS. Secure an electron desktop application developer position. Use the electron documentation for any desktop app feature that isn’t covered in this course. Download the darwin x64 build of Electron 1.4.15 (and cache the downloads in /.electron) Build the macOS Foo Bar.app; Place Foo Bar.app in foobar/Foo Bar-darwin-x64/ (since an out directory was not specified, it used the current working directory) The file structure now looks like. Thousands of organizations spanning all industries use Electron to build cross-platform software. It's easier than you think If you can build a website, you can build a desktop app. Electron is a framework for creating native applications with web technologies like JavaScript, HTML, and CSS.

Build App For Macos Electron Microscopy

The most important thing: only applications based on Electron 5.0.13 and 6.1.7 can be published due to Apple policy. Probably something will be changed soon.

Electron

Important definitions

App

Sandboxing - isolation of your application in special environment with restricted access almost to everything. See original apple video explaining this.

Electron

Build App For Macos Electron Drive

Entitlements - request for permissions for your sandboxed application. Full security entitlements list can be found here.

Provisioning profile - it's something that connect your developer account (certificate), bundle and devices that can install your application.

Publication

Let's imagine that you already have Electron application and you are using Electron builder to build your application.

All listed code can be found at our Electron Nuxt repository.

Build App For Macos Electron Transfer

  1. Go to Certificates, Identifiers & Profiles section at developers.apple.com. At Identifiers section Add new App ID for macOS platform.

    Next go to Profiles and create new Provisioning profile for Mac App Store distribution.

    Download created profile and place to build folder inside your application source folder. Name it as embedded.provisionprofile

  2. Go to App Store Connect and select My Apps. Add New macOS App.

    Select registered on the previous step Bundle ID.

    Provide all required information.

  3. Inside build folder create entitlements.mas.plist with at least the following entitlements:

    To find your DEVELOPERID go to Membership tab ad developers.apple.com. You can find it under Team Name as Team ID. full.package.name is your registered App Identifier.

    At the “build” folder create entitlements.mas.inherit.plist with

    And entitlements.mas.loginhelper.plist with

  4. Go to package.json file and add to the build section.

  5. At this point Electron-builder configuration is finished and you can run electron-builder command to package your app. In case you have multiple developers certificates you need to provide appropriate certificate name as

  6. After build process resulting file can be found at dist/mas/*.pkg and should be uploaded to Mac App Store via Transporter application.

    Unfortunately, in some cases this is not enough and application is getting rejected as not all binaries are signed during packaging by Electron builder. To fix this after step 4 you should:

  1. Create build/resignAndPackage.sh script

    In build/resignAndPackage.sh change APPLICATION NAME to your application name (should be as productName in package.json). Replace CERTIFICATE NAME (***********) to your certificate name in two places.

  2. Binaries that are listed in build/resignAndPackage.sh valid for Electron 5.0.13. You need to updated them for another Electron version or in case additional binaries will be used. To find binaries run (source)

    Binaries from node_modules can be unpacked by listing them in asarUnpack key in package.json

  3. Run

    and upload dist/mas/$APP-mac_store.pkg to Mac App Store via Transporter application.

    That's all. Probably you'll have 'an amusing trip' with Apple team explaining them why you've built your application, why you need permissions listed at entitlement files, but it's another story :-)

    Building something amazing with Electron? Contact us at webspaceteam.com - we always ready to help you with your project.

Other posts

About the App

  • App name: Electron
  • App description: electron (App: Electron.app)
  • App website: http://electron.atom.io/

Build App For Macos Electron Windows 10

Install the App

  1. Press Command+Space and type Terminal and press enter/return key.
  2. Run in Terminal app:
    ruby -e '$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)' < /dev/null 2> /dev/null ; brew install caskroom/cask/brew-cask 2> /dev/null
    and press enter/return key.
    If the screen prompts you to enter a password, please enter your Mac's user password to continue. When you type the password, it won't be displayed on screen, but the system would accept it. So just type your password and press ENTER/RETURN key. Then wait for the command to finish.
  3. Run:
    brew cask install electron

Done! You can now use Electron.

Build

Similar Software for Mac