Rollup.js: A next-generation JavaScript module bundler | Hacker News Reader

Rollup.js: A next-generation JavaScript module bundler

rollupjs.org

57 pointsdmmalam17 comments

They keep a lot of things in query params:

    http://rollupjs.org/#{"options":
    {"format":"es6","moduleName":"myBundle","globals":{}},"modules":
    [{"name":"main.js","code":"import { cube } from './maths.js';\nconsole.log( 
    cube( 5 ) ); // 125"},{"name":"maths.js","code":"// This function isn't used 
    anywhere, so\n// Rollup excludes it from the bundle...\nexport function square ( 
    x ) {\n\treturn x * x;\n}\n\n// This function gets included\nexport function 
    cube ( x ) {\n\t// rewrite this as `square( x ) * x`\n\t// and see what 
    happens!\n\treturn x * x * x;\n}"}]}

Javascript seems to be its own wild west these days.

There's multiple runtimes available so people use it everywhere.

The language is reasonably flexible and there's no enforced conventions, so every library-writer creates their own.

There's no real standard library, so everyone and their grandmother is implementing their own.

There's no real module-system, so everyone is inventing their own.

There's no standard build-system so everyone is creating their own.

The result is a wonderful mess of lots things not really going too well together. Does this remind us of something we have disregarded earlier for exactly the same reasons?

Oh yes it does! Hey, LISP. It seems we're still secretly in love with you :)

I've been dealing with this mess for the last little while and it reminds me of c++: you need to create your own workflow more than with other languages like python.

Being a JS dev myself, I really hate how they just pile tool after tool just because they can. Kinda defeats the original design of JS.

I love it. It works great. Use it with https://github.com/rollup/rollup-babel for a complete es6 build.

So many things are next generation in JS that I can't tell what next generation means for JS anymore. For this package, does it mean I can't use today?

I say that because typical packages do not declare jsnext:main yet, so you need to pass them as a list of external packages to rollup. It seems rollup won't produce an actual bundle when externals are used, is there any documentation about this?

Taking react 0.14 as an example, rollup doesn't accept JSX so it doesn't work there either. Instead, you have to use a package that combines it with babel: rollup-babel (so now we are using a next generation next generation package). But running

rollupbabel --external=react,react-dom --format=cjs --output=bundle.js -- index.jsx

does not result in a bundle.js that bundles React. Is this too old for rollup?

In all honesty, the fact that babel isn't just a "rollup plugin" of sorts, and requires all kinds of custom code and a custom command line tool, makes me a bit wary of rollup.

This is JavaScript land, things move too fast to not have modularity. Babel is going to be horribly outdated and replaced by some other next big thing tomorrow. Or maybe I want to write part of my codebase in PureScript instead. Will I need a "rollupbabelpurescript" concoction?

Or am I completely missing the point here?

I've been using Rollup and Babel together as they are, and it works fine. I haven't tried rollup-babel, but as I understand it, it mostly speeds up the build process.

Well they are actually separate modules, and if you look at rollup-babel you'll see the main reason it exists is to speed up builds.

> Using Rollup then using Babel slows down development, because Babel is much quicker dealing with small files than large bundles. But using Babel then Rollup often means you include helpers (e.g. classCallCheck) multiple times.

They are two separate modules that you can plug into whatever build tool you want separately.

But even if they weren't modular, is it that big of a deal? In my opinion what build tools I use means a lot less than where I'm investing my time in what I learn, and all of these JS tools are building to the ES6 standard.

The idea being, that hopefully someday in the http2 + es6 future we won't need all these build tools, but that shouldn't stop us from building experience on them now.

Why not add a only Tree-Shaking Plugin to Webpack?

Or is there any other breaking feature why a complete new builder is necessary?

Probably for similar reasons webpack didn't add plugins to browserify.

but what were those reasons??

Actually you can go down this rabbithole endlessly, asking each library in turn when they were invented rather than improving the one before...

Looks like webpack2 will have that feature out of the box -https://github.com/webpack/webpack/tree/webpack-2/examples/h...

What's the meaning of the interactive demo on that page? The project description says Rollup bundles modules together into a single file but the demo rather seems to show conversion between the ES2015 module format and other module formats.

Rollup bundles multiple modules into a single module. The output module can be in several different formats. If you're bundling an app, you can use an IIFE ("globals" in the demo).

The point of the tool is to statically analyze your code and only include what the code actually needs. It doesn't mindlessly concatenate and minify everything like what everything else does.

Webpack's commons plugin is still a killer feature. Tree-shaking is nice though.

Reply on news.ycombinator.com