babel ES7 Async - regeneratorRuntime is not defined

Question

I'm using browserify + gulp + babel in my project, and having problem with ES7 features. These are what I installed:

• [email protected]
• [email protected] // for use decorators
• [email protected]
• [email protected]
• [email protected]
• [email protected]
• [email protected]
• [email protected]
• gulp
• gulp-sourcemaps
• vinyl-buffer
• vinyl-source-stream

and this is my gulp code:

gulp.task('build', () => {
    let buildPath;
    let destPath;

    buildPath = `./src`;
    destPath = `./dist`;

    return browserify(`${buildPath}/app.js`)
    .transform(babelify, { 
        presets: ["es2015", "es2016", "stage-0"],
        plugins: ["transform-decorators-legacy", "transform-async-to-generator"]
    })
    .bundle()
    .pipe(source('app.js'))
    .pipe(buffer())
    .pipe(sourcemaps.init({loadMaps: true}))
    .pipe(sourcemaps.write('./'))
    .pipe(gulp.dest(`${destPath}`));
});

and this is my js code:

import 'babel-polyfill';

// Async Functions
function wait(t) {
    return new Promise((r) => setTimeout(r, t));
}

async function asyncMania() {
    console.log('1');
    await wait(1000);
    console.log('2');
}

asyncMania().then(() => console.log('3'));

When I try this, gets an error:

Uncaught ReferenceError: regeneratorRuntime is not defined

Using require instead of import doesn't work either. Most of questions are using Webpack, not browserify and other approaches were not worked on me, so it will be very appreciate tell me how should I do.

And I have one more question, as you can see, I installed babel-preset-es2015 and babel-preset-es2016 both, and both are using. If I remove es2015 plugin, can I still use ES6 features? And also I included babel-preset-stage-0, and as I know this is for experimental ES7 features. What actually babel-preset-es2016 got?

Answer 1

I have same error and fix it by using "babel-plugin-transform-runtime". hope this also work for you.

Babel 6 regeneratorRuntime is not defined with async/await