RegeneratorRuntime is not defined

React開発でasync/awitを使用すると、regeneratorRuntime is not definedが表示される。

Uncaught ReferenceError: regeneratorRuntime is not defined

babel-polyfillを入れ、import "babel/polifill"を挿入したり、babel-plugin-transform-regeneratorの設定でも解決できるが、他に方法がないかを探していた。

以下でも解決できることがわかった。

targetの指定

前提条件として、babel-preset-envが必要。少し前まではよくbabel-preset-es2015が使われていましたが、今は前者が推奨されています。

// .babelrc
{
    "presets": [
        ["env", {
            "targets": {
                "browsers": ["last 2 Chrome versions"]
            }
        }],
        ...
    ],
    ...
}

targetに具体的なブラウザ名を指定してもいいが、どうもChrome以外だと動作が怪しい気がする。ちなみにChromeの場合は、"chrome": "50"から動作可能でした。MDNを見ると完全サポートは55からみたいです。