简体   繁体   English

Babel 7 - 未捕获的 ReferenceError:未定义 regeneratorRuntime

[英]Babel 7 - Uncaught ReferenceError: regeneratorRuntime is not defined

I'm getting the error Uncaught ReferenceError: regeneratorRuntime is not defined using React with webpack and Babel .我收到错误Uncaught ReferenceError: regeneratorRuntime is not defined using React with webpack and Babel 。

在此处输入图片说明

I've followed this answer by defining my .babel.rc as:我已经按照这个答案通过定义我的.babel.rc为:

{
  "presets": ["@babel/preset-env", "@babel/preset-react"] ,
  "plugins": [
      ["@babel/plugin-transform-runtime"]
  ]
}

and running:并运行:

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

However, I get the exact same error afterwards.但是,之后我得到了完全相同的错误。 I've also followed this other answer and this one , but still get the exact same error.我也跟着this other answerthis one ,但仍然得到完全相同的错误。

My babel specific installations in package.json are as follows:我在package.json中的 babel 特定安装如下:

  "dependencies": {
    "@babel/runtime": "^7.14.6"
  },
  "devDependencies": {
    "@babel/core": "^7.14.6",
    "@babel/plugin-transform-runtime": "^7.14.5",
    "@babel/preset-env": "^7.14.7",
    "@babel/preset-react": "^7.14.5"
  }

Any ideas?有任何想法吗?

This ended up working for me:这最终对我有用:

How to allow async functions in React + Babel? 如何在 React + Babel 中允许异步函数?

My problem was that I was defining the babel plugin in both my .babel.rc file and my webpack.config.js file.我的问题是我在.babel.rc文件和webpack.config.js文件中定义了 babel 插件。 I needed to remove that plugin from my webpack.config.js and simply use it only in my .babel.rc file.我需要从我的webpack.config.js删除该插件,并仅在我的.babel.rc文件中使用它。 Then it worked well.然后它运作良好。

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

This is my file .babelrc这是我的文件.babelrc

Look:看:

@babel/preset-env is a smart preset that allows you to use the latest JavaScript without needing to micromanage which syntax transforms (and optionally, browser polyfills ) are needed by your target environment(s). @babel/preset-env 是一个智能预设,它允许您使用最新的 JavaScript,而无需对目标环境需要哪些语法转换(以及可选的浏览器polyfills )进行微观管理。 This both makes your life easier and JavaScript bundles smaller!这既使您的生活更轻松,而且 JavaScript 包更小!

your problemes:你的问题:

You are using "@ babel / preset-env" you must specify the version of node to compile.您正在使用“@ babel / preset-env”,您必须指定要编译的节点版本。 "node> 7.6". “节点> 7.6”。 I recommend 10.我推荐10。

Why node > 7.6 Node.js 7.6 has shipped with official support for async/await enabled by default and better performance on low-memory devices.为什么node > 7.6 Node.js 7.6 提供了对默认启用的 async/await 的官方支持,并在低内存设备上提供了更好的性能。

How do you specify the version: It's simple如何指定版本:很简单

targets.node string | target.node 字符串 | "current". “当前的”。

If you want to compile against the current node version, you can specify "node": "current", which would be the same as "node": process.versions.node.

AND FOR ME LOOK LIKE THIS:对我来说是这样的:

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

This allows the compiler to understand ASYNC AWAIT, hope it helps you!这可以让编译器理解 ASYNC AWAIT,希望对你有帮助!

hey I ran into the same problem and I am using Babel 7, for me I installed these two dependencies:嘿,我遇到了同样的问题,我使用的是 Babel 7,我安装了这两个依赖项:

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

And, in .babelrc, add:并且,在 .babelrc 中,添加:

{
"presets": ["@babel/preset-env"],
"plugins": [
    ["@babel/transform-runtime"]
]

} }

and this solved my problem这解决了我的问题

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 未捕获的 ReferenceError:未定义 regeneratorRuntime - Uncaught ReferenceError: regeneratorRuntime is not defined 未捕获的 ReferenceError:RegeneratorRuntime 未在 React 中定义 - Uncaught ReferenceError: regeneratorRuntime is not defined in React 反应:ReferenceError:regeneratorRuntime 未定义 - React: ReferenceError: regeneratorRuntime is not defined 反应异步并等待引发错误“未捕获的ReferenceError:未定义regeneratorRuntime” - React async and await throwing error 'Uncaught ReferenceError: regeneratorRuntime is not defined' 带有 Babel 的 Webpack 给出未捕获的参考错误:未定义要求 - Webpack with Babel gives uncaught referenceError: require is not defined 未捕获的 ReferenceError:regeneratorRuntime 未在反应 17、webpack 5 中定义,同时通过操作进行 api 调用 - Uncaught ReferenceError: regeneratorRuntime is not defined in react 17, webpack 5 while making api calls through actions 未捕获的 ReferenceError:使用 Sync/Await 时的 regeneratorRuntime - Uncaught ReferenceError: regeneratorRuntime when using Sync/Await 使用gulp-babel会导致Uncaught ReferenceError:未定义require - Using gulp-babel gives Uncaught ReferenceError: require is not defined ReferenceError:运行测试时未定义 regeneratorRuntime - ReferenceError: regeneratorRuntime is not defined when running testing TypeScript React Babel ReferenceError:找不到变量:regeneratorRuntime - TypeScript React Babel ReferenceError: Can't find variable: regeneratorRuntime
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM