環境

webpack 3.10.0

問題

webpackの設定でtargetをelectron-rendererにすると、FormDataが使えない。

const data = new FormData();
data.append(name, value) // ここでエラーになる

webpack関係ないですが、同じように困ってる人もいました。
https://github.com/form-data/form-data/issues/220

かといってtargetをelectron-rendererにしないとrendererプロセスでelectronの機能が扱えない。
shell使ってデフォルトブラウザ開いたり、プロセス間通信したり。

解決策

electronの使いたい機能はバンドル対象のにせず、scriptタグでjsファイルを読み込むようにした。
webpakc.config.jsのtargetからelectron-rendererも削除。

index.html

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <title></title>
</head>

<body>
    <div id="app"></div>
    <script src="./shell.js"></script> // 今回作成したファイル
    <script src="./bundle.js"></script> // バンドルファイル
</body>

</html>

shell.js

const remote = require('electron').remote;
const shell = remote.shell;

const openDefaultBrowser = url => {
    shell.openExternal(url);
};

もっといい方法、webpackの設定での解決法を知ってる人いたら教えてください。

【webpack】target: electron-rendererを設定するとFormDataが使えない

環境

問題

解決策