Rollup在转译async/await时失败 - regeneratorRuntime未定义

Question

Rollup在转译async/await时失败 - regeneratorRuntime未定义

javascriptasynchronousbabeljsrollupjs

8

我想在Rollup中使用async/await。

我在stackoverflow和github上搜索了babel和rollup的相关问题，但没有解决我的问题。

@babel/runtime/regenerator被视为外部依赖项。我看到一个控制台错误：regeneratorRuntime未定义。在你问之前，是的，我查看了每篇涉及此主题的文章，但我找到的没有一篇能解决这个问题。

我已经尝试使用@babel/polyfill，尽管它已经被弃用并且人们说不要使用它。我试过在我的主要导入之前import它，也试过导入transform-runtime，但无论我做什么都不起作用。

编译警告：

src/main.js → dist/bundle.js...
(!) Unresolved dependencies
https://rollupjs.org/guide/en/#warning-treating-module-as-external-dependency
@babel/runtime/regenerator (imported by src/cronreader.js, src/animations.js)
created dist/bundle.js in 549ms

rollup.config.js:

import babel from 'rollup-plugin-babel'
import resolve from 'rollup-plugin-node-resolve'
import async from 'rollup-plugin-async';

export default {
    input: 'src/main.js',
    output: {
        file: 'dist/bundle.js',
        format: 'iife',
        globals: {
            "@babel/runtime/regenerator": "regeneratorRuntime",
            "@babel/runtime/helpers/asyncToGenerator": "asyncToGenerator"
        }
    },
    plugins: [
        async(),
        resolve({
            customResolveOptions: {
                moduleDirectory: 'src'
            }
        }),
        babel({
            runtimeHelpers: true,
            exclude: 'node_modules/**', // only transpile our source code
            presets: ["@babel/preset-env"],
            plugins: [
                "@babel/transform-runtime",
                "@babel/transform-regenerator",
                "@babel/transform-async-to-generator",
            ]
        })
    ]
}

package.json:

"devDependencies": {
    "@babel/core": "^7.5.5",
    "@babel/plugin-transform-async-to-generator": "^7.5.0",
    "@babel/plugin-transform-regenerator": "^7.4.5",
    "@babel/plugin-transform-runtime": "^7.5.5",
    "@babel/preset-env": "^7.5.5",
    "@node-minify/cli": "^4.1.2",
    "@node-minify/crass": "^4.1.2",
    "babel-cli": "^6.26.0",
    "babel-preset-es2015": "^6.24.1",
    "node-minify": "^3.6.0",
    "node-sass": "^4.12.0",
    "rollup": "^1.18.0",
    "rollup-plugin-async": "^1.2.0",
    "rollup-plugin-babel": "^4.3.3",
    "rollup-plugin-node-resolve": "^5.2.0",
    "uglify-js": "^3.6.0"
  },
"scripts": {
    "build": "rollup -c rollup.config.js"
}
  "bundleDependencies": [
    "@babel/runtime"
  ]

没有 .babelrc 文件。

- Kevin Connors

我在使用 rollup 和 babel 时遇到了类似的问题，我也尝试了 transform-runtime 和其他插件，但都无济于事。

  {
    plugins: [
      babel({
        babelrc: false,
        exclude: 'node_modules/**',
        presets: [
          [
            '@babel/preset-env',
            {
              corejs: 3,
              modules: false,
              useBuiltIns: 'usage',
              targets: {
                ie: '11',
              },
            },
          ],
        ],
      }),
    ],
  },
];

- awgreenarrow08

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Kuba · Accepted Answer

不确定您是否已解决问题，但仅供将来参考，此答案对我有帮助 https://dev59.com/b1wX5IYBdhLWcg3wrBB6#36821986

我刚刚使用npm i -D @babel/plugin-transform-runtime安装了 transform-runtime，在 rollup.config.js 中启用了 runtimeHelpers，就像上面所示，然后只需添加：

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

将插件节点添加到 .babelrc 文件中 -> 为了清晰起见，这是我的完整 .babelrc 文件：

{
  "presets": [
    "@babel/preset-env",
    "@babel/preset-react",
    "@babel/preset-flow"
  ],
  "plugins": [
    "@babel/plugin-proposal-class-properties",
    "babel-plugin-inline-json-import",
    ["@babel/plugin-transform-runtime", {
      "regenerator": true
    }]
  ]
}