babelHelpers is not defined: async / await

[SumNeuron]

NOTE: I have read several issues with titles similar to "babelHelpers is not defined" + / - "async await". I have tried several of the proposed solutions which did not work in my case.

Error

babelHelpers is not defined

var anAsyncFunction =
  23 | /*#__PURE__*/
  24 | function () {
> 25 |   var _ref = babelHelpers.asyncToGenerator(
     |             ^
  26 |   /*#__PURE__*/
  27 |   regeneratorRuntime.mark(function _callee(id) {
  28 |     var small,

rollup.config.js

import babel from 'rollup-plugin-babel';
import uglify from 'rollup-plugin-uglify-es';
import minimist from 'minimist';
import pkg from './package.json';

const argv = minimist(process.argv.slice(2));

const config = {
  input: 'src/index.js',
  external: [ 'axios' ],
  output: {
    extend: true,
    name: pkg.name,
    exports: 'named',
    format: 'es',
    globals: { 'axios': 'axios', },
  },
  plugins: [
    babel({
      exclude: 'node_modules/**',
      externalHelpers: true,
      plugins: [
        ['wildcard', {exts: [], nostrip: true, },],
        '@babel/plugin-external-helpers',
      ],
      presets: [['@babel/preset-env', { modules: false }]],

    }),
  ],
};

// Only minify browser (iife) version
if (argv.format === 'iife') {
  config.plugins.push(uglify());
}

export default config;

function causing issue:

// simplification
const anAsyncFunction = async () => {
  let response = await axios.get('my/api/')
  return response
}

Please help

dev dependencies

{
    "@babel/core": "^7.1.0",
    "@babel/plugin-external-helpers": "^7.0.0",
    "@babel/preset-env": "^7.1.0",
    "axios": "^0.18.0",
    "babel-plugin-wildcard": "^5.0.0",
    "minimist": "^1.2.0",
    "rollup": "^0.66.2",
    "rollup-plugin-babel": "^4.0.3",
    "rollup-plugin-uglify-es": "0.0.1"
}

[SumNeuron]

I've gone ahead and fiddled with my rollup.config file

import babel from 'rollup-plugin-babel';
//..
const config = {
//..
  external: [
    'axios',
    '@babel/runtime/regenerator',
    '@babel/runtime/helpers/asyncToGenerator'
  ],
  output: {
    globals: {
      'axios': 'axios',
      '@babel/runtime/regenerator': '_regeneratorRuntime',
      '@babel/runtime/helpers/asyncToGenerator': '_asyncToGenerator',
    },
  },
  plugins: [
    babel({
      exclude: 'node_modules/**',
      runtimeHelpers: true,
      externalHelpers: true,
      plugins: [
        [
          'wildcard',
          {
            exts: [],
            nostrip: true,
          },
        ],
        '@babel/plugin-external-helpers',
        '@babel/plugin-transform-runtime'
      ],
      presets: [
        [
          '@babel/preset-env',
          {
            modules: false,
          },
        ],
      ],
    }),
  ],
};

//..

I can now import without error but trying to call the code in this sandbox results in

callee$@https://pyx14r6jpm.codesandbox.io/src/components/HelloWorld.vue?5f16105a:63:17
tryCatch@https://pyx14r6jpm.codesandbox.io/node_modules/regenerator-runtime/0.13.2/runtime.js:45:40
invoke@https://pyx14r6jpm.codesandbox.io/node_modules/regenerator-runtime/0.13.2/runtime.js:271:22
defineIteratorMethods/</prototype[method]@https://pyx14r6jpm.codesandbox.io/node_modules/regenerator-runtime/0.13.2/runtime.js:97:21
asyncGeneratorStep@https://pyx14r6jpm.codesandbox.io/node_modules/@babel/runtime-corejs2/helpers/asyncToGenerator.js:5:24
_next@https://pyx14r6jpm.codesandbox.io/node_modules/@babel/runtime-corejs2/helpers/asyncToGenerator.js:27:9
_asyncToGenerator/</<@https://pyx14r6jpm.codesandbox.io/node_modules/@babel/runtime-corejs2/helpers/asyncToGenerator.js:34:7
Promise@https://pyx14r6jpm.codesandbox.io/node_modules/core-js/library/modules/es6.promise.js:177:7
_asyncToGenerator/<@https://pyx14r6jpm.codesandbox.io/node_modules/@babel/runtime-corejs2/helpers/asyncToGenerator.js:23:12
go@https://pyx14r6jpm.codesandbox.io/src/components/HelloWorld.vue?5f16105a:95:20
mounted@https://pyx14r6jpm.codesandbox.io/src/components/HelloWorld.vue?5f16105a:103:10
invokeWithErrorHandling@https://pyx14r6jpm.codesandbox.io/node_modules/vue/dist/vue.common.dev.js:1859:57
callHook@https://pyx14r6jpm.codesandbox.io/node_modules/vue/dist/vue.common.dev.js:4210:7
insert@https://pyx14r6jpm.codesandbox.io/node_modules/vue/dist/vue.common.dev.js:3142:7
invokeInsertHook@https://pyx14r6jpm.codesandbox.io/node_modules/vue/dist/vue.common.dev.js:6331:28
patch@https://pyx14r6jpm.codesandbox.io/node_modules/vue/dist/vue.common.dev.js:6548:5
lifecycleMixin/Vue.prototype._update@https://pyx14r6jpm.codesandbox.io/node_modules/vue/dist/vue.common.dev.js:3939:19
updateComponent@https://pyx14r6jpm.codesandbox.io/node_modules/vue/dist/vue.common.dev.js:4057:10
get@https://pyx14r6jpm.codesandbox.io/node_modules/vue/dist/vue.common.dev.js:4468:25
run@https://pyx14r6jpm.codesandbox.io/node_modules/vue/dist/vue.common.dev.js:4543:22
flushSchedulerQueue@https://pyx14r6jpm.codesandbox.io/node_modules/vue/dist/vue.common.dev.js:4301:13
nextTick/<@https://pyx14r6jpm.codesandbox.io/node_modules/vue/dist/vue.common.dev.js:1985:12
flushCallbacks@https://pyx14r6jpm.codesandbox.io/node_modules/vue/dist/vue.common.dev.js:1911:14

I find this odd because this happens even when I import the module directly (rather than the rollup-ed version)

[SumNeuron]

While the provided code is fairly minimal I went ahead and made an even more minimal example:

MWE:
git repo: https://gitlab.com/SumNeuron/raab

Test the async function:
codesandbox: https://codesandbox.io/s/6ynk7mqpvw

This seems to work? (although it throws errors when built npm run build)

However the example above (the same structure and config) does not work (sandbox https://codesandbox.io/s/pyx14r6jpm)

[jcubic]

I have same issue but got error ReferenceError: regeneratorRuntime is not defined

Is there a way to use Rolup, Babel and async/await?

[jcubic]

The only way to fix the issue is to add this in the file:

import regeneratorRuntime from '@babel/runtime/regenerator';

why don't adding options to import external modules or load this one by default? This plugin configuration don't work you can't set this import with rollup config.

This will work if you remove externalHelpers: true, option from config, otherwise you will probably need to import whole thing to have babelHelpers variable.

[jcubic]

Here is my setup, finally it's working (without need for import):

import commonjs from "rollup-plugin-commonjs";
import nodeResolve from "rollup-plugin-node-resolve";
import babel from "rollup-plugin-babel";

export default {
    input: "src/lips.js",
    output: {
        name: "lib",
        file: "dist/lips.js",
        format: "iife",
        globals: {
            "@babel/runtime/regenerator": "regeneratorRuntime"
        }
    },
    plugins: [
        babel({
            "babelrc": false,
            "runtimeHelpers": true,
            "plugins": [
                "@babel/plugin-transform-async-to-generator",
                "@babel/plugin-transform-regenerator",
                ["@babel/plugin-transform-runtime", {
                    "helpers": true,
                    "regenerator": true
                }]
            ],
            "presets": [
                "@babel/preset-env"
            ],
            "exclude": "node_modules/**"
        }),
        nodeResolve({
            mainFields: ["jsnext:main"]
        }),
        commonjs({
            include: "node_modules/**"
        })
    ]
};

[Andarist]

The OP has liked the solution posted above so I'm going to assume that the issue got resolved. If not please respond back and share a repro case - then I will be able to take a look at this.

[jayu]

Above solution works, however it is worth adding it to documentation IMO