CODEWITHSUNDEEP
javascriptnode.jsecmascript-6async-awaitbabeljs
anonpd762
anonpd762

Reputation: 93

Babel CLI ReferenceError : regeneratorRuntime is not defined

These are my dependencies in package.json :

"devDependencies": {
  "babel-cli": "^6.24.1",
  "babel-polyfill": "^6.23.0",
  "babel-preset-env": "^1.6.0",
  "babel-preset-stage-0": "^6.5.0",
}

I can compile just fine with "babel server -d transpiled" (I have everything in a server folder instead of src).

The problem occurs when I try to run the transpiled code with "node transpiled/index.js". I get

ReferenceError: regeneratorRuntime is not defined

I did some searching and it seemed that the issue was that I don't have babel-polyfill when using await/async, but I actually do.

Here is my index.js file 

require('babel-polyfill');
require('./server');

Here is also my .babelrc file

{
  "presets": ["env", "stage-0"]
}

What exactly is going on and why am I getting this error? I already have babel-polyfill so this shouldn't be happening.

Upvotes: 4

Views: 1580

Answers (2)

Chayemor
Chayemor

Reputation: 3717

I had the exact same problem and have been crying over it, my set up ended having all of these:

.babelrc

{ "presets": [ "env", "stage-2", "react" ] }

To avoid hoisting this is my app.js

require('babel-register');
require('babel-polyfill');
require('./server');

Where server is where my express code actually resides.

The pièce de résistance and what finally made my set up work without that damn error, in my webpack, for the entry point, I had to add babel-polyfill first.

const webpackConfig = {
    mode: 'development',
    entry: {
        app: ['babel-polyfill', APP_ENTRY_FILE]
    },
....

I hope it helps you!

Upvotes: 0

Eduardo Rocha
Eduardo Rocha

Reputation: 148

I ran into the same problem today. According to this issue, the function declarations are hoisted, and they end up before the imports in the transpiled code.

To solve this issue you could change the entry point of your application, so that the first file could import the polyfill, and then import the rest of your app. Something like this:

import 'babel-polyfill';
import './app';

Another solution is to convert your async function declarations to the variable style, so instead of this async myFunction {} you could use this const myFunction = async () => {}. That way, as the function is now a variable, it won't be hoisted before the require("babel-polyfill").

Upvotes: 2

Related Questions