Electronで配布用の実行ファイルを作る手順

前回、Ubuntu20.10にElectron環境を構築する手順を書きました。今回は作ったアプリ実行ファイルにビルドする方法について書きます。

非IT企業に勤める中年サラリーマンのIT日記

前回のElectron情報は古かったようなので改めて書く（Ubuntu20.10）

前回、Ubuntu20.10にElectron環境を構築する手順を書きました。しかし、どうやらプロジェクト作成のところが古いやり方だったらしく、その部分のみ改めて書き直します。※Electronのインストールのところは問題ないのでそこは書きません。 プロジェクトの作成任意のフォルダ上で以下のコマンドを打つとpackage.jsonというファイルが生成されます。$ npm init -y  前回記事ではpackage.jsonの中身を修正しましたがそんなことをしなくてもOKです。 Electronのインストール以下のコマンドを実行して、Electronをインストー...

ネットで調べるとelectron-builder を使った方法がほとんどですが、残念ながらうまく行きませんでした（調査中）。もう1つのやり方としてelectron-packagerを使った方法がありそっちはうまく行ったので紹介したいと思います。

プログラムは前回のものを使います。現時点では以下のようなファイル構成になっています。ここから実行ファイルを作ってみましょう。

asarとelectron-packagerをインストール

まずは、Electronのライブラリもひっくるめてアーカイブ化する必要があります。このアーカイブ化のためにasarというアプリが必要になりますので、コマンドプロンプト上で以下のコマンドを打ってインストールしましょう。

$ sudo npm install -g asar

次に配布用バイナリとしてパッケージングするためのelectron-packagerをインストールします。

$ sudo npm install electron-packager -g
 

これで準備は完了です。

実行ファイルの作成

インストールしたら、asarを使ってアーカイブ化します。以下のコマンドを打ってください。ここでの「test」というのはプロジェクトを生成した場所（フォルダ名）となります。

$ asar pack ./Test ./test.asar

以下の通り、test.asarというファイルが生成されました。

以下のコマンドを打って実行ファイルを作成しましょう。–platformオプションでlinuxを指定することでLInux用の実行ファイルを作ります。

$ electron-packager . TestApp --platform=linux --arch=x64 --electronVersion=3.0.9

以下の通り、TestApp-linux-x64というフォルダが生成されました。

TestApp-linux-x64フォルダを開くとTestAppという実行ファイルがあるので、それをダブルクリックするとアプリが起動します。

TestApp-linux-x64フォルダごと配布することでElectron環境のない人にもアプリを使ってもらえるわけですね。

 - Electron, Linux