horrible.md

I'm using Rollup.js to bundle Node modules into a website. I have some code like:

import { zepto } from '../node_modules/npm-zepto/zepto/dist/zepto.js';
import { waypoints } from '../node_modules/waypoints/lib/zepto.waypoints.js';

Rollup, apparently, just concatonates imported files. What's fun is that Zepto uses the "No semicolon unless you absolutely need it" syntax style, whereas everyone else does not. So the concatonated code looks like:

;(function(){ ... zepto code ... })()
(function(){ ... waypoints code ...})();

Which, as you can imagine, does not work (since JS interpretes it as (zepto_stuff)()(waypoints_stuff)()).

I could just stick a semicolon inbetween those two import statements, but rollup does not seem to honor that– it just puts all the imported code at the top of the bundle file. My super hacky solution for the moment is to just create a new JS file that consists entirely of a single semicolon:

/* Everything is aweful */
;

And then importing it:

import { zepto } from '../node_modules/npm-zepto/zepto/dist/zepto.js';
import { semicolon } from './semicolon.js';
import { waypoints } from '../node_modules/waypoints/lib/zepto.waypoints.js';

Now, to be fair, I'm messing around with a lot of technologies I haven't really done much with before (including both rollup and es2015 modules). It's entirely possible there's a non-ridiculous solution to this issue. But this is part of a hack-day project– a prototype for something that we might want to do on the main site. So I'm willing to accept some amount of hackiness.