如何在React + Babel中允许异步函数?

of1yzvn4  于 2022-12-08  发布在  Babel
关注(0)|答案(2)|浏览(140)

我有一个Typescript/React应用程序,它可以使用then/catch承诺执行异步函数,但不能使用async/await/try/catch。
错误为:未捕获引用错误:未定义regeneratorRuntime。
错误似乎来自Babel。以下是我的配置:

{
  "presets": [
    "@babel/preset-env",
    "@babel/preset-typescript",
    "@babel/preset-react"
  ],
  "plugins": ["babel-plugin-styled-components"]
}

如何解决这个问题?

pftdvrlh

pftdvrlh1#

您可以在此处找到您的解决方案
如果我总结一下,那么你必须安装一个名为plugin-transform-runtimebabel插件,并需要配置.babelrc设置。

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

安装这两个插件后,转到.babelrc文件并添加这些插件。

"plugins": [
    ["@babel/plugin-transform-runtime",
      {
        "regenerator": true
      }
    ]
  ],
w41d8nur

w41d8nur2#

巴别塔7

所有必要的软件包都包含在“@babel/preset-env”中

{
    "presets": [
        [
            "@babel/preset-env",
            {
                "targets": {
                    "node": "10.0.0"
                }
            }
        ],
        "@babel/preset-react"
    ]
}

超级基本示例

import React from "react";

const Board = () => {

    const [resp_post, setResp_post] = React.useState(0);

    (async function getData() {
        setResp_post(await Promise.resolve(30));
    })();
    
    return <h1>Board {resp_post} {value}</h1>;
};

export default Board;

preset-env documentation
preset-reactlink documentation

相关问题