CODEWITHSUNDEEP
javascriptnode.jsecmascript-6commonjsrollupjs
Ahmed Fasih
Ahmed Fasih

Reputation: 6927

Rollup with CommonJS module exporting an unnamed function as the module?

I have a CommonJS module, called inner.js, that defines a function and then exports that function as the entire module:

// inner.js, a legacy CommonJS module
var foo = function() { return 42; };
module.exports = foo;

In Node, I can readily verify this works as-is.

> var inner = require('./inner.js');
> inner() // prints 42

But that’s a legacy module that I’d like to use from a ES6 module, called outer.js:

// outer.js, an ES6 module
import * as inner from "./inner.js";
export function bar() { return inner(); }

I see that rollup-plugin-commonjs is commonly used in these situations but I can’t get it to work when the CommonJS inner.js module exports a function as the whole module. If, after running rollup and dumping the result to loadme.js, I try to run load the ES6 outer module and try to call the function originally defined in the inner CommonJS module, I get an error:

> var outer = require('./loadme.js')
undefined
> outer.bar()
TypeError: inner$2 is not a function
    at Object.bar (/.../so-rollup-question/loadme.js:27:25)

I think I’m just failing to load the CommonJS module correctly, in such a way that the module itself functions as a function. I’m not familiar enough with UMD to get anything meaningful out of inspecting the rollup-output.

The rest of this post is about a minimum example.

Here’s my very simple index.js:

// index.js
export {bar} from "./outer.js";

which is read by my rollup config:

// rollup.config.js
import npm from "rollup-plugin-node-resolve";
import commonjs from 'rollup-plugin-commonjs';

export default {
  entry : "index.js",
  format : "umd",
  moduleName : "sphereModule",
  plugins : [ npm({jsnext : true}), commonjs() ],
  dest : "loadme.js"
};

I have a complete clonable repository demonstrating the problem.

Upvotes: 1

Views: 4445

Answers (1)

Felix Kling
Felix Kling

Reputation: 816334

Assigning directly to module.exports is basically equivalent to having a default export. Hence importing the module as follows should work:

import inner from "./inner.js";

Upvotes: 4

Related Questions