I want to use async/await with rollup.

I tried searching for babel and rollup issues on stackoverflow and github and nothing resolved my issue.

@babel/runtime/regenerator is being treated as an external dependency. I see a console error: regeneratorRuntime is not defined. Before you ask, yes I did look at every other post with this topic and none of the ones I could find solved this issue.

I've tried using @babel/polyfill even though it's deprecated and people say not to use it. I've tried importing it before my main imports, I've tried importing transform-runtime, nothing I do works.

Compile warning:

src/main.js → dist/bundle.js...
(!) Unresolved dependencies

@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"
  ]

There is no .babelrc file.

I want to use async/await with rollup.

I tried searching for babel and rollup issues on stackoverflow and github and nothing resolved my issue.

@babel/runtime/regenerator is being treated as an external dependency. I see a console error: regeneratorRuntime is not defined. Before you ask, yes I did look at every other post with this topic and none of the ones I could find solved this issue.

I've tried using @babel/polyfill even though it's deprecated and people say not to use it. I've tried importing it before my main imports, I've tried importing transform-runtime, nothing I do works.

Compile warning:

src/main.js → dist/bundle.js...
(!) Unresolved dependencies
https://rollupjs/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"
  ]

There is no .babelrc file.

• javascript
• asynchronous
• babeljs
• rollupjs

• I'm having a very similar issue with getting this to work with rollup and babel. I also tried the transform-runtime and other plugins, all to no avail. [ { plugins: [ babel({ babelrc: false, exclude: 'node_modules/**', presets: [ [ '@babel/preset-env', { corejs: 3, modules: false, useBuiltIns: 'usage', targets: { ie: '11', }, }, ], ], }), ], }, ]; – awgreenarrow08 Commented Aug 12, 2019 at 18:17

1 Answer 1

Not sure if you already solved the issue, but just for a future reference, this answer did it for me https://stackoverflow./a/36821986/839273

I just installed transform-runtime with npm i -D @babel/plugin-transform-runtime, enabled runtimeHelpers in rollup.config.js like you have it above and then just added

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

to plugins node inside .babelrc -> just for clarity this is my plete .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
    }]
  ]
}