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 import
ing 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.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"
]
There is no .babelrc file.
You can fix it in one of the following ways: Add @babel/runtime to your Babel config, which loads the helpers from @babel/runtime (including regeneratorRuntime ) Manually add import "regenerator-runtime" in your source, which defines the regeneratorRuntime global.
Rollup is a module bundler for JavaScript which compiles small pieces of code into something larger and more complex, such as a library or application. It uses the new standardized format for code modules included in the ES6 revision of JavaScript, instead of previous idiosyncratic solutions such as CommonJS and AMD.
Not sure if you already solved the issue, but just for a future reference, this answer did it for me https://stackoverflow.com/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 complete .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
}]
]
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With