DEV

Electron - ビルドしてみる

#Electron

ビルドは、下記に説明があります。

アプリケーションの配布

Mac用のアプリを、下記２つを使って、ビルドしてみたいと思います。

ビルドするアプリ

今回ビルドするのは、下記を使おうと思います。

https://github.com/edo1z/electron_study — github.com

electron-packagerでビルドしてみる

$ git clone [email protected]:edo1z/electron_study.git
$ cd electron_study
$ yarn install
$ yarn global add electron-packager
$ electron-packager . hoge --platform=darwin --arch=x64
Downloading tmp-3856-0-electron-v2.0.11-darwin-x64.zip
[============================================>] 100.0% of 48.75 MB (894.54 kB/s)
Packaging app for platform darwin x64 using electron v2.0.11
Wrote new app to /path/to/hoge/electron_study/hoge-darwin-x64

作成された、hoge.appフォルダを圧縮して、macに送って、macでhoge.appを開いたら正常に動きました。

electron-builderでビルドしてみる

ここにドキュメントあります。

とりあえずインストールして、実行してみたら、勝手にdistフォルダが作成されました。

$ yarn add -D electron-builder
$ npx electron-builder
  • electron-builder version=20.31.2
  • writing effective config file=dist/builder-effective-config.yaml
  • no native production dependencies
...

今使ってるPCがUbuntuなので、勝手にlinux用が作られたっぽい。 下記のようにすると、処理の途中でエラーで強制終了になった。。でもmac用のhoge.appが作られていた。hoge.appはmacで問題なく動作した。

$ npx electron-builder -m --x64
Error: spawn hdiutil ENOENT
    at Process.ChildProcess._handle.onexit (internal/child_process.js:232:19)
    at onErrorNT (internal/child_process.js:407:16)
    at process._tickCallback (internal/process/next_tick.js:63:19)
...

下記によると、macのdmgは、macOS上のみビルドできるらしい。Macでやってみたら、エラーでずに、dmgファイルもつくられました。dmgをmacで実行したら、問題なく動作しました。

https://github.com/electron-userland/electron-builder/issues/811 — github.com

アイコンの設定

electron-builderでやります。

とりあえず、512x512のicon.pngをつくって、buildフォルダに入れてビルドしたらできた。 dist/.icon-icns/icon.icnsというのができてて、icon.icnsには色んなサイズの画像が入ってるっぽいので、できてるっぽい。 hoge.app開いてもicon表示された。

署名とかは今度やってみる。