はじめに
「ElectronとVue.jsをかじってみる」ですっぴんElectronアプリを作りました。ロゴやバージョン情報を表示するだけですが、初めてのElectronアプリということで、ちょっと楽しい。
クロスプラットフォームなアプリを作ることができるのが、Electronの特徴の1つです。今回はすっぴんアプリをWindowsで動くようにパッケージ化してみます。
毎度毎度荒っぽいですが、今回も荒々しく行きます。
とりあえずゴールすれば良し！ゴールしてから振り返り！
パッケージングで使うツール
electron-vueプロジェクトを新しく作ったとき、パッケージングツールとしてelectron-builderを選んだのでそれを使います。
electron-packagerというツールもあります。
yarn add electron-packagerで導入可能ですが、今回は使いません。
早速パッケージ化
Mac(64bit)用にパッケージ化します。
yarn electron-builder --mac --x64いざ実行すると、なんとエラー。
Error: Application entry file "dist/electron/main.js" in the "/~/sample_project.app/Contents/Resources/app.asar" is corrupted
Error: ENOENT: no such file or directory, open '/~/sample_project.app/Contents/Resources/app.asar'一発ではうまくいかないだろうと思ってました。想定の範囲内なので驚きませぬ。
でも不思議なことに、buildディレクトリにmacディレクトリが作成されており、中にappファイルができていたのです！！
アプリケーションを実行してみる
パッケージングのコマンドが
Error Command failed with exit code 1で終了したので無駄でしょうが、せっかくappファイルができていたので、実行してみましょう。
動いた！！
なぜ……
改めてエラーを見てみる
何かファイルが無いと言われている
no such file or directory, open '/***.app/Contents/Resources/app.asar'appファイル内にapp.asarがあるか、まず見てみましょう。
→ありました。
何かが破損していると言われている
Application entry file "dist/electron/main.js" in the "/***.app/Contents/Resources/app.asar" is corruptedapp.asarの中にあるmain.jsが破損しているとのこと。
dist/electron/main.jsを見てみると、難読化されたソースでした。(読む気は即座に失せました)
結論
クロスプラットフォームなアプリは(パッと見た感じでは)簡単にできます！
アプリはあります！
結果的にはアプリはできています。ただし、パッケージ化のコマンドが正しく完了していないとのことなので、何らかのエラーを抱えている可能性があります。
セキュリティ関係のことも含めて、もっと調べる必要がありそうです。
何か釈然としない……
エラーの原因(推定)
asar形式での圧縮の際にエラーが起こっている- 難読化された
dist/electron/main.jsの中で何か文法エラーのようなものが起こっている
もしかすると、これら以外の原因があるかもしれないです。見つかれば追記するかもしれません。
まさかelectronのバージョンが低すぎるからとか？
参考
Windows用にパッケージ化
LinuxでWindows向けのパッケージングをするのは少々癖があるようです。
yarn electron-builder --win --x64なおwineが必要と言われるので、未インストールの場合は、
yarn add wineを実行してください。
注意：できたexeは未検証
手元にWin機が無いため出来上がったexeファイルの実行確認はしていません。
注意：wineをいれたのにwineが無いと言われてしまう
どこかで見たパターン。
yarnしたはずなのにwineが無いと言われる。でも、exeファイルはできている不思議。
Linux用にパッケージ化
yarn electron-builderオプションなしでLinux(64bit)用にパッケージングしてくれます。