Error when using generator functions

[zhaoyao91]

Current Behavior

after add some code with generator, it generates some code which lead to

Uncaught ReferenceError: regeneratorRuntime is not defined

I tried to solve it with microsoft/TypeScript-Babel-Starter#26 (comment), but it gave me other error:

(babel plugin) Error: Runtime helpers are not enabled. Either exclude the transform-runtime Babel plugin or pass the `runtimeHelpers: true` option. See https://github.com/rollup/rollup-plugin-babel#configuring-babel for more information

Your environment

Software	Version(s)
TSDX	0.12.3
TypeScript	3.8.2
Browser	chrome
npm/Yarn	yarn 1.21.1
Node	12.14.1
Operating System	mac

[zhaoyao91]

@agilgur5 I've tried this, no luck.
currently I use the facebook's regenerator-runtime as a workaround: https://github.com/facebook/regenerator/tree/master/packages/regenerator-runtime

just add import "regenerator-runtime/runtime"; to the index.ts file. Not ideal.

[devanfarrell]

I didn't realize this was supposed to be supported. Here is my babel config I've also been using as a work around. https://github.com/devanfarrell/redux-dogma/blob/master/.babelrc

[zhaoyao91]

@agilgur5
after adding @babel/plugin-transform-runtime, it still output Uncaught ReferenceError: regeneratorRuntime is not defined error.

when using regenerator-runtime/runtime, I don't have to add @babel/plugin-transform-runtime.

[zhaoyao91]

@devanfarrell this may work but it seems not an extensible way since it replace the internal config.

[agilgur5]

So I added an integration test for this in #627 and that made it easier to investigate this.

• TSDX already uses @babel/plugin-transform-regenerator internally, it's just only used for generators and async generators, not plain async/await (async: false). Sorry about the confusion on this, I didn't realize it was already included.
• @babel/plugin-transform-runtime is also a dependency of TSDX (but not used internally, might be a peerDep of something?) and it's one possible solution here. Configuring helpers: false causes your output file to have import _regeneratorRuntime from '@babel/runtime/regenerator'; added:

// .babelrc.js
module.exports = {
  plugins: [
    ['@babel/plugin-transform-runtime', { helpers: false }]
  ]
}

I believe this works the same as runtimeHelpers: true. I don't think we'll be setting that as a default however, as that's a decision for the author to make (how they want to use helpers/polyfills). So this is a good user-land alternative.

The other option would be to use preset-env's useBuiltIns, but TSDX currently excludes regenerator because of async-to-promises usage. That might change in the future, however, as async-to-promises has a number of bugs (see the label here) and is no longer maintained 😞

In theory, you might be able to override the exclusion with:

// .babelrc.js
module.exports = {
  presets: [
    ['@babel/preset-env', { useBuiltIns: 'usage', corejs: 3, excludes: ['', ''] }],
  ],
}

but I'm not sure that'll work.

Closing this issue since there is a way to do it/workaround available.

EDIT: also this seems to be a duplicate of #169 so marking it as such

[agilgur5]

Automatic pure polyfilling of generators with babel-plugin-polyfill-regenerator for targets that need a polyfill has been added in #795 and will be released in v0.14.0 soon.