Uncaught SyntaxError：导入_regeneratorRuntime的意外标识符

Question

我正在遵循React setup guide首次设置React。但是，我已经在代码中添加了async / await。当预处理器-npx babel运行时，输出文件如下所示：

并且浏览器控制台给我错误：

Uncaught SyntaxError: Unexpected identifier

导入。

我已检查babel-runtime在我的节点模块中。

我的package.json依赖项如下：

  "dependencies": {
    "babel-cli": "^6.26.0",
    "babel-preset-react-app": "^3.1.2"
  }

Answer 1

首先，删除旧的依赖

npm uninstall -D babel-cli babel-preset-react-app babel-runtime

然后添加最新的依赖

npm i -D @babel/core @babel/preset-react @babel/cli babel-runtime

安装最新的依赖后package.json看起来像

"devDependencies": {
    ...
    "@babel/cli": "^7.13.14",
    "@babel/core": "^7.13.8",
    "@babel/preset-env": "^7.13.9",
    "@babel/preset-react": "^7.13.13",
    "babel-runtime": "^7.0.0-beta.3",
    ...

修复此问题后，您可能会遇到问题（regeneratorRuntime is not defined），然后您需要在 HTML 文件中添加 runtime.js 脚本

https://github.com/facebook/regenerator/blob/master/packages/runtime/runtime.js