Can't bundle React v0.16.0 with Rollup

[tmcw]

All-in-one-ready-to-go testcase here: https://github.com/tmcw/rollup-react-repro

With input:

import React from "react";
console.log(React);

And config:

import node from "rollup-plugin-node-resolve";
import replace from "rollup-plugin-replace";
import commonjs from "rollup-plugin-commonjs";

export default {
  input: "index.js",
  output: {
    file: "output.js",
    format: "iife",
    name: "ObservableApp"
  },
  plugins: [
    node(),
    commonjs({
      include: "node_modules/**"
    }),
    replace({
      "process.env.NODE_ENV": JSON.stringify(process.env.NODE_ENV),
    })
  ]
};

Rollup produces an incorrect bundle and fails on this error:

/Users/tmcw/p/rollup-react-test/output.js:654
objectAssign$1(pureComponentPrototype, ReactComponent.prototype);
^

TypeError: objectAssign$1 is not a function

This error does not exist with React v0.15 - it's new in 0.16.

---

The core bug, which is quite a head-scratcher is:

var objectAssign$1 = require$$0;
var require$$0 = warning_1;

This is, confusingly, the block that binds require$$0. The second var gets hoisted, so objectAssign$1 is assigned to the value undefined.

[TrySound]

There is not react 0.15 and 0.16. They are major 15.0.0 and 16.0.0

[mbostock]

Specifically, the problem appears to be that the input CommonJS module that Rollup is trying to transpile includes a number of variables with the $-number suffix such as objectAssign$1 and require$$0. Replacing the $ with another symbol eliminates the error. I will try to isolate the test case further.

[mbostock]

Okay. Reduced test case here: https://github.com/mbostock/rollup-1655

This appears to be a bug in rollup-plugin-commonjs. Here’s index.js:

import "./common-entry";

And common-entry.js, a CommonJS module:

(function() {
  var foo = require('./common-foo');
  var require$$0 = "FAIL"; // COMMENT THIS LINE TO SUCCEED.
  console.log(foo);
})();

And lastly common-foo.js, another CommonJS module:

module.exports = "bar";

If you comment out the require$$0 definition, foo has the expected value rather than undefined.

[mbostock]

It seems like rollup-plugin-commonjs doesn’t check that the requireid does not already exist in scope; it only checks against the requireid’s it has allocated internally.

https://github.com/rollup/rollup-plugin-commonjs/blob/5f9b99c5bed1cc4dddd88c33465ed34a10016a00/src/transform.js#L87-L99

[tmcw]

This issue in rollup-plugin-commonjs is reporting the same issue - closing in favor of it: rollup/rollup-plugin-commonjs#232