先日から開発を始めた Electron アプリに、API との通信処理で async/await
を使う用記述したら「Uncaught ReferenceError: regeneratorRuntime is not defined」というエラーが発生したので、その対処法についてです。
最初エラーメッセージを見た時は、「regeneratorRuntime が定義されていない?そもそも呼んでないが?」となりました。
参考にさせていただいた記事はこちら。
Webpack + Babel で async/await 使ったら「regeneratorRuntime is not defined」エラー – キリウ君が読まないノート
https://note.kiriukun.com/entry/20200704-regeneratorRuntime-is-not-defined
まず、必要なライブラリをインストールします。
npm install --save @babel/runtime npm install --save-dev @babel/plugin-transform-runtime
そうしたら、webpack.config.js
を修正します。
修正する箇所は下記のとおりです。
const webpack = require('webpack'); module.exports = { ...... module: { rules: [ { test: /\.js?$/, exclude: /node_modules/, use: [ { loader: 'babel-loader', options: { presets: ["@babel/preset-env", "@babel/preset-react"], plugins: ['@babel/plugin-transform-runtime'], // <- この行を追加 }, } ] } ] }, ...... };
ちょっと長いサンプルコードですが、実際には 15 行目の 1 行を追加するだけです。
こちらを追加後、Electron のアプリをビルドし、実行したところ、エラーが発生しなくなりました!
以上、Babel と Webpack を導入していた Electron アプリで「Uncaught ReferenceError: regeneratorRuntime is not defined」が発生した時の対処方法でした。
ご参考になれば幸いです。