ElectronでLinux向けに書き出すまで(macOS)

環境のセットアップからクロスコンパイルするところまで試しました。
WinとMacはすんなりビルドできたのですが、Linux(Raspberry Pi)への書き出しで戸惑ったので、まとめておきます。

## 使用環境

OS : macOS Ventura 13.0
Electron : v31.7.3
Node : v20.18.0


## セットアップ

いくつか方法があるようですが、Viteを使うことが多いので今回はelectron-viteを利用しました。
https://electron-vite.org/

electronを導入するときの設定も自動で行ってくれるので、簡単に起動できます。


```powershell
% npm create @quick-start/electron

% cd electron-app
% npm run dev
```


![スクリーンショット 2024-10-30 14.10.42.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3166965/6d04ffa1-0dd2-a4f5-d204-b18d974d8fbb.png)

あとは自由にHTMLを書きます。


## ビルド
Linux向けに書き出します。
デバイスはRaspberry Pi 4でOSはRaspberry Pi OS(64bit)を使用しています。

```powershell
# linux
% npm run build:linux
```

エラーが出ました。

```powershell
  ⨯ snapcraft is not installed, please: brew install snapcraft
  ⨯ /Users/mypcname/web/electron-app/node_modules/app-builder-bin/mac/app-builder_arm64 process failed ERR_ELECTRON_BUILDER_CANNOT_EXECUTE
Exit code:
1  failedTask=build stackTrace=Error: /Users/mypcname/web/electron-app/node_modules/app-builder-bin/mac/app-builder_arm64 process failed ERR_ELECTRON_BUILDER_CANNOT_EXECUTE
Exit code:
1
    at ChildProcess.<anonymous> (/Users/mypcname/web/electron-app/node_modules/builder-util/src/util.ts:252:14)
    at Object.onceWrapper (node:events:629:26)
    at ChildProcess.emit (node:events:514:28)
    at maybeClose (node:internal/child_process:1091:16)
    at Process.ChildProcess._handle.onexit (node:internal/child_process:302:5)
```

どうやら`snapcraft`が必要なようなので、`brew`を使ってインストールします。

```powershell
% brew install snapcraft
```

再度チャレンジしますが、またエラーが発生しました。

```powershell
You need 'multipass' set-up to build snaps: https://multipass.run.
  ⨯ exit status 2
github.com/develar/app-builder/pkg/util.ExecuteAndPipeStdOutAndStdErr
	/Volumes/data/Documents/app-builder/pkg/util/exec.go:23
github.com/develar/app-builder/pkg/package-format/snap.buildWithoutTemplate
	/Volumes/data/Documents/app-builder/pkg/package-format/snap/snap.go:352
github.com/develar/app-builder/pkg/package-format/snap.Snap
	/Volumes/data/Documents/app-builder/pkg/package-format/snap/snap.go:204
github.com/develar/app-builder/pkg/package-format/snap.ConfigureCommand.func1
	/Volumes/data/Documents/app-builder/pkg/package-format/snap/snap.go:82
github.com/alecthomas/kingpin.(*actionMixin).applyActions
	/Volumes/data/go/pkg/mod/github.com/alecthomas/kingpin@v2.2.6+incompatible/actions.go:28
github.com/alecthomas/kingpin.(*Application).applyActions
	/Volumes/data/go/pkg/mod/github.com/alecthomas/kingpin@v2.2.6+incompatible/app.go:557
github.com/alecthomas/kingpin.(*Application).execute
	/Volumes/data/go/pkg/mod/github.com/alecthomas/kingpin@v2.2.6+incompatible/app.go:390
github.com/alecthomas/kingpin.(*Application).Parse
	/Volumes/data/go/pkg/mod/github.com/alecthomas/kingpin@v2.2.6+incompatible/app.go:222
main.main
	/Volumes/data/Documents/app-builder/main.go:90
runtime.main
	/usr/local/Cellar/go/1.17/libexec/src/runtime/proc.go:255
runtime.goexit
	/usr/local/Cellar/go/1.17/libexec/src/runtime/asm_arm64.s:1133
  ⨯ /Users/mypcname/web/electron-app/node_modules/app-builder-bin/mac/app-builder_arm64 process failed ERR_ELECTRON_BUILDER_CANNOT_EXECUTE
Exit code:
1  failedTask=build stackTrace=Error: /Users/mypcname/web/electron-app/node_modules/app-builder-bin/mac/app-builder_arm64 process failed ERR_ELECTRON_BUILDER_CANNOT_EXECUTE
Exit code:
1
    at ChildProcess.<anonymous> (/Users/mypcname/web/electron-app/node_modules/builder-util/src/util.ts:252:14)
    at Object.onceWrapper (node:events:629:26)
    at ChildProcess.emit (node:events:514:28)
    at maybeClose (node:internal/child_process:1091:16)
    at Process.ChildProcess._handle.onexit (node:internal/child_process:302:5)
```

またエラー。今度はmultipassが必要らしいです。
コメントにある[https://multipass.run/](https://multipass.run/)から、macOS用のインストーラーを入手し、インストールします。


再度ビルドを試します。

```powershell
% npm run build:linux
```


<img width="300" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3166965/2e6ae9dc-28b8-b37d-39ae-1e30cb7f5598.png">

暫くして`.deb`ファイルが生成され、ビルドが成功しました。
この`.deb`ファイルをUSBなどでRaspberry Piに転送します。

GUI版では、ファイルを右クリックしてインストールが可能です。