Gatsby: "regeneratorRuntime is not defined" throwing this error with plugins

Created on 15 Aug 2017  ·  31Comments  ·  Source: gatsbyjs/gatsby

When I'm trying to include data source as contentful, JSON it's throwing this error regeneratorRuntime is not defined I don't know why is that ? When I'm simply just including this to plugins as array and recompile the whole project it's not compiling and throwing this error. I don't understand why is that happening.

Most helpful comment

I did this and it helped somewhat, but what really solved it was adding:

exports.modifyBabelrc = ({ babelrc }) => ({
  ...babelrc,
  ...process.env.NODE_ENV !== 'development' && {
    plugins: babelrc.plugins.concat(['transform-regenerator', 'transform-runtime']),
  },
});

Don't forget to also install:

    "babel-plugin-transform-runtime": "^6.23.0",
    "babel-polyfill": "^6.26.0",
    "babel-runtime": "^6.26.0",

Works great now with async Apollo queries on https://spacechop.com

btw, tell me if you want a 3 month free test coupon on SpaceChop! :D

All 31 comments

I just tried reinstalling the latest code with https://github.com/gatsbyjs/gatsby/tree/master/examples/using-contentful and didn't see this error. Can you reproduce your error with this site? We've seen a few reports of this error lately but don't know why it's happening. Perhaps it's something about your setup.

If you can reproduce the problem there, please list your version of node/npm/operating system.

If you can't reproduce the problem, try removing node_modules and reinstalling.

also make sure you have the latest gatsby-cli installed.

npm install -g gastby-cli@latest

I had the same issue, but I re-installed using the latest cli and the issue went away.

@KyleAMathews @bskimball I couldn't figure out the issue but by simply re installing everything seems working. I don't know why is the problem was firing.

I got the same problem. I cloned the gatsby-blog-starter repo and I was able to compile without any issue. Then I removed the gatsby-transformer-sharp and gatsby-plugin-sharp plug-in and everything was still compiled just fine until I closed the current terminal session. The next time I ran gatsby develop, I immediately got the gegeneratorRuntime is not defined errors. It seems to me that the cause of this is either the gatsby-transformer-remark package or the fact that I am using WSL to run gatsby.

I will re-produce and provide screenshot of the errors if you need.

Try upgrading gatsby-cli to the latest version.

I upgraded gatsby-cli and it seems the problem is solved. Thanks @KyleAMathews 👍

(Just adding another data point.) Even after updating gatsby-cli to the latest, I see this same error coming from node_modules/bluebird/js/release/async.js after updating my modules (yarn upgrade-interactive) and running gatsby develop.

This error occurs for me after updating either:

  • gatsby-source-filesystem from 1.0.1 to 1.4.2
  • gatsby-plugin-sharp from 1.3.0 to 1.6.1

All other plugins/transforms upgrade successfully.

More specifically, this broke with the most recent releases:

  • gatsby-source-filesystem version 1.4.2
  • gatsby-plugin-sharp version 1.6.1

Which I think means this must point to PR #1757? cc @jquense

@bvaughn do you have an idea which file is throwin the error? All new code should grab the runtime from babel-runtime and _not_ rely on a globally available one. I'm wondering if maybe some package slipped through tho?

As in perhaps some plugin wasn't published again after we changed that

@jquense hasn't happened yet… https://github.com/gatsbyjs/gatsby/issues/1825

The error would be different tho if the problem was babel-runtime is missing. e.g. "Cannot find module babel-runtime/regenerator", this sounds like it's looking for a global regenerator

For gatsby-plugin-sharp the stack is:

ReferenceError: regeneratorRuntime is not defined
    at /Users/bvaughn/Documents/git/react/www/node_modules/gatsby-plugin-sharp/index.js:12:47
    at Object.<anonymous> (/Users/bvaughn/Documents/git/react/www/node_modules/gatsby-plugin-sharp/index.js:97:2)
    at Module._compile (module.js:573:30)
    at Object.Module._extensions..js (module.js:584:10)
    at Module.load (module.js:507:32)
    at tryModuleLoad (module.js:470:12)
    at Function.Module._load (module.js:462:3)
    at Module.require (module.js:517:17)
    at require (internal/module.js:11:18)
    at Object.<anonymous> (/Users/bvaughn/Documents/git/react/www/node_modules/gatsby-transformer-sharp/extend-node-type.js:28:17)
    at Module._compile (module.js:573:30)
    at Object.Module._extensions..js (module.js:584:10)
    at Module.load (module.js:507:32)
    at tryModuleLoad (module.js:470:12)
    at Function.Module._load (module.js:462:3)
    at Module.require (module.js:517:17)

Which points to:

var _ref4 = (0, _asyncToGenerator3.default)(regeneratorRuntime.mark(function _callee2(_ref3) {

For gatsby-source-filesystem the stack is:

ReferenceError: regeneratorRuntime is not defined
    at /Users/bvaughn/Documents/git/react/www/node_modules/gatsby-plugin-sharp/index.js:12:47
    at Object.<anonymous> (/Users/bvaughn/Documents/git/react/www/node_modules/gatsby-plugin-sharp/index.js:97:2)
    at Module._compile (module.js:573:30)
    at Object.Module._extensions..js (module.js:584:10)
    at Module.load (module.js:507:32)
    at tryModuleLoad (module.js:470:12)
    at Function.Module._load (module.js:462:3)
    at Module.require (module.js:517:17)
    at require (internal/module.js:11:18)
    at Object.<anonymous> (/Users/bvaughn/Documents/git/react/www/node_modules/gatsby-transformer-sharp/extend-node-type.js:28:17)
    at Module._compile (module.js:573:30)
    at Object.Module._extensions..js (module.js:584:10)
    at Module.load (module.js:507:32)
    at tryModuleLoad (module.js:470:12)
    at Function.Module._load (module.js:462:3)
    at Module.require (module.js:517:17)

Which points to:

var _ref4 = (0, _asyncToGenerator3.default)(regeneratorRuntime.mark(function _callee2(_ref3) {

So both are referencing an undefined regeneratorRuntime

@KyleAMathews it may be that those plugins were published again since nothing in them technically changed (according to lerna)?

In version <= 1.4.1 of gatsby-source-filesystem there's a require at the top of the compiled plugin:

var _regenerator = require("babel-runtime/regenerator");
var _regenerator2 = _interopRequireDefault(_regenerator);

But in version 1.4.2 it's gone. Ditto for gatsby-plugin-sharp.

Seems like we need to add babel-plugin-transform-runtime as a dependency.

yeah, 1.4.2 I believe contained a change where we just relied on the global polyfill, we then reverted that to go back to babel-runtime for the packages. We do need to add the runtime as a dep , tracking that here: #1825

Excellent. Thanks for the update

I added babel-runtime to all packages so hopefully this error won't show up anymore.

So I think we are at the end of a path so we can close this issue? @KyleAMathews

Yeah. We can reopen if it's still causing trouble.

@KyleAMathews when importing separate modules that require regeneratorRuntime getting the error ReferenceError: regeneratorRuntime is not defined

I'f I'm trying to use typescript async, I'm getting this issue.

Same issue here. Getting regeneratorRuntime is not defined

try adding the following to gatsby-node.js

exports.modifyBabelrc = ({ babelrc }) => {
  babelrc.plugins.push('transform-regenerator');
  return babelrc;
};

exports.modifyWebpackConfig = ({ config, stage }) => {
  if (stage === 'build-javascript') {
    config._config.entry.app = ['babel-polyfill', config._config.entry.app];
  }
  return config;
});

I did this and it helped somewhat, but what really solved it was adding:

exports.modifyBabelrc = ({ babelrc }) => ({
  ...babelrc,
  ...process.env.NODE_ENV !== 'development' && {
    plugins: babelrc.plugins.concat(['transform-regenerator', 'transform-runtime']),
  },
});

Don't forget to also install:

    "babel-plugin-transform-runtime": "^6.23.0",
    "babel-polyfill": "^6.26.0",
    "babel-runtime": "^6.26.0",

Works great now with async Apollo queries on https://spacechop.com

btw, tell me if you want a 3 month free test coupon on SpaceChop! :D

@timbrandin Would this have fixed your problem? https://github.com/gatsbyjs/gatsby/issues/1847#issuecomment-372761930

Noop, did not have to do with Babel-polyfon at all

@timbrandin awesome that helped alot but to run npm run build, I also need to:
npm i babel-plugin-transform-runtime or yarn add babel-plugin-transform-runtime

For anyone coming across this in more recent history than 2018, it appears that the gatsby APIs used to accomplish this have changed. I was able to get this working with the following in gatsby-node.js:

exports.onCreateBabelConfig = ({ actions }) => {
  if (process.env.NODE_ENV !== 'development') {
    actions.setBabelPlugin({
      name: '@babel/plugin-transform-regenerator',
      options: {},
    });
    actions.setBabelPlugin({
      name: '@babel/plugin-transform-runtime',
      options: {},
    });
  }
};
Was this page helpful?
0 / 5 - 0 ratings

Related issues

dustinhorton picture dustinhorton  ·  3Comments

Oppenheimer1 picture Oppenheimer1  ·  3Comments

KyleAMathews picture KyleAMathews  ·  3Comments

totsteps picture totsteps  ·  3Comments

timbrandin picture timbrandin  ·  3Comments