Electron 初挑戦メモ

Quick Start

起動

$ git clone https://github.com/electron/electron-quick-start
$ cd electron-quick-start
$ npm install --platform=win32
# 下記エラーが出たので --no-sandbox 追加
# FATAL:gpu_data_manager_impl_private.cc(441)] GPU process isn't usable. Goodbye.
# https://github.com/Automattic/simplenote-electron/issues/3096
$ npm start -- --platform=win32 --no-sandbox

https://www.electronjs.org/docs/latest/tutorial/quick-start
https://github.com/electron/electron-quick-start
https://www.electronforge.io/guides/developing-with-wsl

electron-quick-start は index.html と render.js のボイラープレート

配布バイナリ作成

Windows 用に配布バイナリ作成。

$ ./node_modules/.bin/electron-builder -w
$ chmod +x dist/electron-quick-start\ Setup\ 1.0.0.exe
$ ./dist/electron-quick-start\ Setup\ 1.0.0.exe

インストール先は下記。デスクトップにアイコンが作られる

C:\Users[user]\AppData\Local\Programs\electron-quick-start\electron-quick-start.exe

「アプリの一覧」からアンインストール可能

https://www.electron.build/

Uncaught ReferenceError: require is not defined

レンダー側はセキュリティ上の理由でデフォルトでは require() が使えない
安全に使うには preload.js を利用

https://www.electronjs.org/docs/latest/tutorial/tutorial-preload
https://qiita.com/nomuyoshi/items/9091abd9dc3b05c85f44

作り込み

前回終了時のウィンドウ位置やサイズを復元

https://medium.com/@hql287/persisting-windows-state-in-electron-using-javascript-closure-17fc0821d37
https://github.com/electron/electron/issues/526

Forge vs. Builder

Electron 公式は Electron Forge 推し
どっちがいいか比較＆検討する

https://www.electronforge.io/core-concepts/why-electron-forge
https://www.reddit.com/r/electronjs/comments/pek7d5/electronbuilder_vs_electronforge/
https://github.com/electron-userland/electron-builder/issues/1193

app.asar から不要ファイルを取り除く
.gitignore は除外されるけど、README.md や .vscode などが含まれるのを除外

electron-builders でカレントディレクトリの取得
Windows のポータブルの場合
Mac の場合

ipc の安全な使い方