electron unable to load preload のエラー回避
状況
mysql2を使用するためにpreloadでipc通信の定義?をしたい
electron+react+typescript+viteのため、構成が複雑
package.jsonでは"type": "module",を設定している
エラー内容
import export まわりでエラーが発生している模様
解決方法
拡張子:preload.ts => preload.mts
ESM のプリロードスクリプトは拡張子が .mjs でなければなりません
プリロードスクリプトは "type": "module" フィールドを無視するため、ESM のプリロード スクリプトでは .mjs ファイル拡張子を使用 しなければなりません。
esmoduleとして使うには、preload.mjsとしなきゃならない
mainスクリプトは、.jsでいいのにね
サンドボックスを無効化
import path from "node:path";
import { dirname } from "path";
import { fileURLToPath } from "url";
...
webPreferences: {
preload: path.join(__dirname, "preload.mjs"),
nodeIntegration: true,
},
nodeIntegration: trueの場合はサンドボックスも無効になります
サンドボックス化されたプリロードスクリプトは、ESM のコンテキストがないプレーンな JavaScript として実行されます。 外部モジュールを使用する必要がある場合は、プリロードのコードにバンドラを使用することをお勧めします。 electron API の読み込みは、引き続き require('electron') を介して行われます。
*サンドボックス有効でもバンドラーを使えば、モジュールを使うことはできそう
Q.なぜサンドボックス無効化にsandbox: falseを使わないのか
A.nodeIntegration: trueを使っている人が多いのでそれにならったが理由は分からず。