codemix/babel-plugin-closure-elimination

_regeneratorRuntime not defined when using this plugin

beckend opened this issue · 18 comments

Using preset 'stage-0' which includes async/await.

Gvozd commented

Please add more information
I try to reproduce your problem, but stage-0 not use _regeneratorRuntime (with our plugin, and without)
And in my example, both compiled versions - works correctly

I compile this code, used only stage-0 preset

async function foo() {
  return 'foo' + (await bar());
}
async function bar() {
  return 'bar';
}
foo().then(x=>console.log(x))

Without plugin

'use strict';
let foo = (() => {
  var ref = _asyncToGenerator(function* () {
    return 'foo' + (yield bar());
  });

  return function foo() {
    return ref.apply(this, arguments);
  };
})();

let bar = (() => {
  var ref = _asyncToGenerator(function* () {
    return 'bar';
  });

  return function bar() {
    return ref.apply(this, arguments);
  };
})();

function _asyncToGenerator(fn) { return function () { var gen = fn.apply(this, arguments); return new Promise(function (resolve, reject) { function step(key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { return Promise.resolve(value).then(function (value) { return step("next", value); }, function (err) { return step("throw", err); }); } } return step("next"); }); }; }

foo().then(x => console.log(x));

With plugin

'use strict';
let foo = (() => {
  var ref = _asyncToGenerator(_ref);

  return function foo() {
    return ref.apply(this, arguments);
  };
})();

let bar = (() => {
  var ref = _asyncToGenerator(_ref2);

  return function bar() {
    return ref.apply(this, arguments);
  };
})();

function _asyncToGenerator(fn) { return function () { var gen = fn.apply(this, arguments); return new Promise(function (resolve, reject) { function step(key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { return Promise.resolve(value).then(function (value) { return step("next", value); }, function (err) { return step("throw", err); }); } } return step("next"); }); }; }

function* _ref() {
  return 'foo' + (yield bar());
}

function* _ref2() {
  return 'bar';
}

foo().then(x => console.log(x));

Please, write your minimal problem code, and .babelrc(any plugins/presets except stage-0 and closure-elimination ?)
Order in babelrc - may be important also

.babelrc

{
  "env": {
    "production": {
      "presets": [ "es2015-webpack", "react", "stage-0" ],
      "plugins": [
        "closure-elimination",
        "transform-runtime",
        "transform-decorators-legacy",
        "jsx-control-statements",
        "add-module-exports",
        "transform-flow-strip-types"
      ]
    }
  }
}

I tried to move it to the bottom in the plugin list I still get.

@beckend I tried your .babelrc, but does have import _regeneratorRuntime from 'babel-runtime/regenerator'; in transformed code, and it's no problem with webpack2 build. Could you please provide code?

It's a very large codebase and I use async await everywhere...I'm sorry that I can't share it since it's closed source anyways.

I don't know what use case causing this issue, the problem no explanation, maybe you can use a simple code to reproduce this issue? :)

i have a test case that only occurs when i use this with babel-plugin-lodash:

file:

import { sortBy } from 'lodash'

async function editThing () {

}

code:

r = babel.transform(str, { presets: ['es2015', 'stage-1'], plugins: ['transform-runtime', 'closure-elimination', 'lodash']})
console.log(r.code)

result:

'use strict';

var _regenerator = require('babel-runtime/regenerator');

var _regenerator2 = _interopRequireDefault(_regenerator);

var _asyncToGenerator2 = require('babel-runtime/helpers/asyncToGenerator');

var _asyncToGenerator3 = _interopRequireDefault(_asyncToGenerator2);

var _sortBy2 = require('lodash/sortBy');

var _sortBy3 = _interopRequireDefault(_sortBy2);

var editThing = function () {
  var ref = (0, _asyncToGenerator3.default)(_ref);
  return function editThing() {
    return ref.apply(this, arguments);
  };
}();

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

var _marked = [_ref].map(_regeneratorRuntime.mark);

function _ref2(_context) {
  while (1) {
    switch (_context.prev = _context.next) {
      case 0:
      case 'end':
        return _context.stop();
    }
  }
}

function _ref() {
  return _regenerator2.default.wrap(_ref2, _marked[0], this);
}

_regeneratorRuntime should really be _regenerator2.default, which is returned if i remove either closure-elimination or lodash

/cc @jdalton

Which version of babel-plugin-lodash?

babel-plugin-lodash@3.1.0 
babel-plugin-closure-elimination@1.0.6 
babel-core@6.8.0

thanks @jdalton!

Try the latest babel-plugin-lodash@3.1.4

same result :/

https://github.com/jongleberry/babel-preset-jongleberry if that's any help. i commented out this plugin in isomorphic.js and react.js

Thanks! It would help if you provide what the expected output is and
also file an issue in the babel-plugin-lodash repo.

@jonathanong please could you try setting "passPerPreset": true in your babelrc? Issues like this are often related to plugin ordering, so fiddling with that might be worthwhile.

@phpnode did not help. will look into this strange option, though...

@jdalton will do so shortly!

Summary of the finding here. It looks like a closure-elimiation issue.
You should be able to repro this without babel-lodash-plugin using path.hub.file.addImport.

@jdalton yeah I didn't expect it to be lodash' plugin but I found it weird that the error only happened when using it. Thanks for looking into it!

No problem. Happy to help. Hit me up anytime.

Gvozd commented

Still have problems?
Please, try version 1.1.0