Example is broken?

[Swaagie]

First of all great concept and nice work on rollup.js. Tried to setup a minimal example with a few imports from node_modules, however rollup with the options as per the provided example is dead in the water. .then (to write the bundle) seems to never be called. Without the plugin everything seems to work as expected.

[Rich-Harris]

Could you try adding .catch( function ( err ) { console.log( err ); }) to the end? Hopefully it will help us track down the problem. Or if you can create a small repo that reproduces the problem I can take a look. Thanks

[Swaagie]

This seems not to be an issue, could be a feature (option: extensions), but perhaps is better as a new separate plugin I think. One of the components I was pulling in from node_modules is a React component. It has the extensions .jsx and that will result in [Error: Could not load node_modules/loading-component/index.jsx.js (imported by index.js): ENOENT: no such file or directory, open 'node_modules/loading-component/index.jsx.js']

edit: curious on your thoughts

[Swaagie]

If I remove that, it will be a [Error: Module node_modules/react/react.js does not export default (imported by index.js)]. I reckon that is deliberate, but could that be changed? E.g. do we always need an export default

[Swaagie]

Finally if I include a single dependency, which only has

export default () => {
  alert('test');
}

and call that method from the entry file, the code does not seem to end up in output file. Using the jsnext option here.

[mshick]

Same problem here. It doesn't seem to work with default exports. So, the following fails:

export default { foo: function() { return "bar" } };

While this succeeds:

export const foo =  function() { return "bar" };

When doing this:

import { foo } from "module";

[Victorystick]

@mshick That is expected behavior.

The following statements are not equivalent.

// default export
export default { foo: 1};

// named export
export var foo = 1;

To import a default export, you should write:

import mod from 'mod';

And for named exports:

import { foo } from 'mod';

[mshick]

Makes sense, thanks for the explanation. I think babel may have handled the module syntax differently at some point, and I got into some bad habits.

I ended up going with the following style for my module; it's working well:

export { default foo } from "./foo";

[Victorystick]

@mshick Did you mean?

export { default as foo } from './foo.js';

[mshick]

oops, yeah, typo.

[eventualbuddha]

This is not an issue, right? Close?

[mshick]

Yes, thanks!

On Nov 7, 2015, at 22:00, Brian Donovan notifications@github.com wrote:

This is not an issue, right? Close?

―
Reply to this email directly or view it on GitHub.

[AJamesPhillips]

Hi, I'm not sure on how to deal with errors such as:

[Error: Module node_modules/react/react.js does not export default (imported by index.js)]

or in my case:

[Error: Module /Users/project/node_modules/angular-animate/angular-animate.js does not export default (imported by /Users/project/node_modules/angular-animate/index.js)]

I have a ./src/app.js like:

require('angular-animate');
var angular = require('angular');
angular.module('test_App', ['ngAnimate']);

and a build script that I run with node 4.2.2 LTS:

var rollup = require('rollup').rollup;
var rollupNpm = require('rollup-plugin-npm');
var rollupCommonjs = require('rollup-plugin-commonjs');

rollup({
  entry: './src/app.js',
  plugins: [
    rollupCommonjs(),
    rollupNpm({
      jsnext: false,
      main: true
    })
  ]
})
.then((bundle) => {
  bundle.write({
    dest: './built/app.js',
    format: 'iife',
    moduleName: 'app1234'
  });
})
.catch((error) => {
  console.error(error);
});

Any pointers would be much appreciated. Great work on the tool and integrations so far though! :)

[mshick]

@AJamesPhillips I'm not sure about your approach to requiring angular-animate. Has that worked for you in the past? It seems like it would be relying upon some global object (e.g., window) if it did work, and with a bundler that approach might not function as in a browser.

Looking here https://www.npmjs.com/package/angular-animate I see that the angular-animate module is required directly into the array of angular modules. In the case of your code that would look more like this:

var ngAnimate = require('angular-animate');
var angular = require('angular');
angular.module('test_App', [ngAnimate]);

Basically, angular-animate might be commonjs compatible and export the plugin, rather than dangling it off of window or some other object. Give it a shot.

I'd also suggest using the rollup.config.js syntax. I used an approach similar to yours, but found it much nicer that way. It works like this:

1. Make a file rollup.config.js
2. In that file (you can use all babel ES6, including import in there, btw) export an object that is effectively your rollup config + your bundle.write. See below for example:
3. Run rollup with the rollup -c flag.

import npm from "rollup-plugin-npm";
import commonjs from "rollup-plugin-commonjs";
export default {
  entry: "src/app.js",
  plugins: [npm(), commonjs()],
  dest: "built/app.js",
  format: "iife"
};

[Rich-Harris]

I think what's happening here is that when angular-animate/index.js requires angular-animate/angular-animate.js, it tries to import the default export – buggy behaviour on the part of rollup-plugin-commonjs (it should just be a bare import './angular-animate'). Because angular-animate isn't actually a CommonJS module but some good old fashioned global namespace hackery, rollup-plugin-commonjs leaves it alone, and doesn't add an export default whatever at the end. That might be okay (assuming angular is always registered as a global – yuck – I'm not sure how things work in Angular land), but the first part (attempting to import a non-existent default export) isn't. Opening a separate issue for that.