Node.js & webpack & babel で「 regeneratorRuntime is not defined」が発生する場合の対処

  • 19
    いいね
  • 0
    コメント
この記事は最終更新日から1年以上が経過しています。

ちょっとハマった Node.js & webpack & babel の環境で発生する下記のエラーへの対処方法です。

regeneratorRuntime is not defined

原因

ES6にGeneratorという機能があるのですが、ソースコードでこれを使っているとBabelはこれを変換してGeneratorに対応していない処理系でも動くようにしてくれます。
「regeneratorRuntime」はこの処理を実現するためにBabelのランタイムに定義されている関数です。
つまり、Babelのランタイムが読み込まれていないから「regeneratorRuntime is not defined」が発生しているわけです。

たぶんベストの対処方法

とりあえず発生させないようにする方法はいくつかあるのですが、一番良い方法はwebpack.config.jsでbabelのgeneratorの変換を止める方法です。
nodejsを使う場合はGeneratorは実装されているので変換する必要がありません。
変換してしまうとパフォーマンスが劣化したり想定外の動きになったりすることも考えられるため、nodejsの場合は変換しないのがベストな方法かと思います。

webpack.config.js
loader: 'babel?blacklist[]=regenerator'

その他の対処方法

babel/polyfillを使う

require 'babel/polyfill'

babel-runtimeを使う

npm i --save babel-runtime
webpack.config.js
loader: 'babel?optional[]=runtime'