こうこく
作 ▸
改 ▸

Webpack + Babel で async/await 使ったら「regeneratorRuntime is not defined」エラー

Webpack + Babel + React やってるとき、データの取得に async/await を使ったら以下のエラーが出た。

Uncaught ReferenceError: regeneratorRuntime is not defined
webpack 4.41.2babel/code 7.7.2babel/plugin-transform-runtime 7.10.4

基本的には以下の記事を参考させていただいて対処。

"regeneratorruntime is not defined"

以下の記事も参考になった。

@babel/plugin-transform-runtime を理解する(Babel 7) - Qiita

修正方法

必要なものをインストール。

npm install @babel/runtime
npm install --save-dev @babel/plugin-transform-runtime

webpack.config.js に書いてるBabel設定に、プラグイン @babel/plugin-transform-runtime を追加

webpack.config.js
const webpack = require('webpack');

module.exports = {
  ...
  module: {
    rules: [
      {
        test: /\.jsx?$/,
        exclude: /node_modules/,
        loader: 'babel-loader',
        options: {
          presets: ['@babel/preset-env', '@babel/preset-react'],
          plugins: ['@babel/plugin-transform-runtime'],
        },
      },
    ...

これだけでエラー出なくなった。

取り急ぎ。

この記事に何かあればこちらまで (非公開)