Build Bundle about systemjs-hmr

[jjrv]

I'm currently using systemjs-builder through cbuild to bundle systemjs-hot-reloader (the version in your PR that's not merged yet). The script is here (bundle-reloader) and the resulting bundle is here with a corresponding autogenerated config.js.

cbuild is basically a wrapper around systemjs-builder that finds packages installed using npm. It attaches to the builder's normalize hook so any missing files are looked up using browser-resolve and if found, reported to the builder so it bundles them and added to config.js so SystemJS knows how to transform their paths also at run-time.

I think it works nicely at the moment. With a prebuilt bundle, Babel is then not needed for developing with hot reloading.

[alexisvincent]

cbuild is really interesting. I've been wanting to build a very similar thing for a few weeks now. And I'd really like to speak to you about a bit of possible collaboration. I've sent you a PM on gitter.

With regards to using it here, I still want to babel/rollup, for the following reasons.

1. I'm not wanting to bundle a bunch of external deps. Just some simple code splitting in the project.
2. I don't particularly want to have the module exporting a System.register api
3. I want to make use of babel transforms here
4. Rollup is the simplest way I know how to do what I want

cbuild for me feels like it would be better suited to bundling at the application level

[jjrv]

Yes, it's meant for app level and bundling the reloader was basically a free side effect. If there's a way to create a more minimalistic bundle and with fewer tools, that would be better. systemjs-builder is a bit bloated IMO (depends on Babel and Traceur) but for bigger apps I can't think of an alternative that would play as nicely with SystemJS at run-time.

[alexisvincent]

I think actually that the best way to build this will be with systemjs-builder don't know why I didn't think of this before

[mavericken]

I'm experimenting with using jspm bundle in conjunction with systemjs-hmr & systemjs-hot-reloader. It feels like it shouldn't take much changes, but I haven't gotten it working yet.

[alexisvincent]

Does it complain that it can't find @hot?

[alexisvincent]

If so, add '@hot': {'build': false} to your meta in your config

[mavericken]

Ah, I don't have a build config yet as I am still using the CLI, "jspm bundle". I did "jspm bundle client/**/* - [systemjs-hmr]" and it worked (I'm still on [email protected]).

The way I have it working now seems nice. With everything besides systemjs-hmr in the bundle, initial load is fast, and the hot reload works on individual files so I can see changes immediately and keep my state. Still trying to muddle through more issues though (currently having trouble with hot reload getting bugged out once I rebuild the bundle). Ideally I'll have "jspm bundle --watch" going so that I don't have to deal with stale bundled code later when doing a full refresh.

[peteruithoven]

@mavericken the beta version of jspm supports this, it has a --watch flag.
Before trying this be aware that it uses a slightly different config. Install it by npm install jspm@beta.
More info: jspm.io/0.17-beta-guide/

[mavericken]

I am using the --watch flag. Current problem is that as soon as the bundle.js changes, hot reload breaks completely. It seems I can rather easily work around it by just filtering out bundle.js changes, but trying to figure out the actual problem.

Edit: I figured it out that bug, fix pull request available here: #13

[alexisvincent]

Bundling via rollup