Choo: make a umd build available for unpkg CDN

[peter-sharp]

Would it be possible to make a UMD build of choo available on npm? That way it colud be used via unpkg CDN on the likes of codepen, jsfiddle, etc.

[yoshuawuyts]

It should already be available (: - if it's not we should probably update
our build scripts. That said: I'm curious as to why you'd want an UMD
build? People have brought it up before, but at least I don't quite have a
good grasp as to why people need it (:

On Tue, Jul 25, 2017 at 8:38 PM Peter Sharp [e-mail]
wrote:

Would it be possible to make a umd build of choo available on npm? That
way it colud be used via unpkg http://unpkg.com CDN on the likes of
codepen, jsfiddle, etc.

—
You are receiving this because you are subscribed to this thread.
Reply to this email directly, view it on GitHub
https://github.com/choojs/choo/issues/537, or mute the thread
https://github.com/notifications/unsubscribe-auth/ACWleqKyNOjLdQPvP0b313NZ8_UP0dQeks5sRjY7gaJpZM4Oi9Gk
.

[tgfjt]

@yoshuawuyts
This is 404: https://unpkg.com/choo/dist/bundle.js
I think that dist dir should be files on package.json for that, I'm not sure tho.:P

[peter-sharp]

@yoshuawuyts less of a need more of a want. I want to be able to use choo on codepen, but they don't have any form of js module support appart from modifying the global object. 😛

[yoshuawuyts]

Hahaha, yeah fair enough. Fixes would be heaps welcome!

On Wed, Jul 26, 2017, 08:17 Peter Sharp [e-mail] wrote:

@yoshuawuyts https://github.com/yoshuawuyts less of a need more of a
want. I want to be able to use choo on codepen, but they don't have any
form of js module support appart from modifying the global object. 😛

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/choojs/choo/issues/537#issuecomment-317958889, or mute
the thread
https://github.com/notifications/unsubscribe-auth/ACWler72441UjOdfVU6FoLI4pnPorIo7ks5sRtn5gaJpZM4Oi9Gk
.

[tgfjt]

Here you are! #539

[tgfjt]

watching:P

It's okay now.
https://unpkg.com/[email protected]/dist/bundle.js

[YerkoPalma]

Just curious, how would this be used? If that link is included in an standalone html file, then you should add a script with something like

var app = choo()
// ...

Or there is different syntax? and what about 'choo/html' how it is exposed/used then?

[tgfjt]

I was just thinking the same thing.
Is it time to define window.choo?
Thinking...

I agree that we can try choo on codepen or something like that.:)

[toddself]

The browserify command needs to be passed in -s during the build so it creates a standalone module.

[YerkoPalma]

@toddself :O I though it already do that... anyway, I'm still not clear of how it works the standalone module.
Building something like this

 browserify -e index.js -o dist/bundle.js -s Choo

will add the global Choo object in the browser. Should bel be bundled too? so people could use choo/html?

[tgfjt]

Yeah we need both Choo and bel in window. It's... just something like uncomfortable, right?

[YerkoPalma]

I've just tried making a standalone build of choo and also of choo/html, and including both scripts in an html file, and it works fine. Now, I'm not sure if that's the way to go for a standalone build. Maybe in the main choo function we could expose choo/html as a a property, so people could do

var html = Choo.html
// instead of var html = require('choo/html')

[toddself]

I feel like this is a lot of stuff to add to make this code work in an environment it isn't designed for?

What is nice about the choo/html reference is that if you're not using bel in your app, you don't have to bundle it.

I think a more appropriate way to do this would be to also make a standalone build for bel so you have to link to both of them? (In fact I'm not even sure choo should provide bel at all... idk)

[YerkoPalma]

@toddself so, the first option I talked is better, different builds for choo and bel.
Now, I agree that it shouldn't be choo job to provide a bel UMD build, but bel isn't doing it, so for a complete standalone experience, it seems necesary.

[bcomnes]

Is this something that interested parties could maintain in a separate choo-umd package?

[YerkoPalma]

How would a separate package would be maintained? I think, in fact, that a choo-umdmodule is a good idea, but that module should be automatically updated/maintained after every choo release right?
A manually maintained package would be tedious, IMO it is something that should be done in some ci hook (not sure exactly how)

[bcomnes]

Greenkeeper + a release maintainer?

[YerkoPalma]

Hi @bcomnes I want to take this old thread to finally come with an usable standalone choo package.
Here is a couple of things I've been thinking:

• We should have a choo-umd package or something.
• The new repo should have Greenkeeper active and choo as the only dependency.
• We could publish it through travis with npm releasing
• With a before_deploy hook we should build and expose a Choo and a Html object for choo and bel respectively.

If this is correct, we could have an easy to maintain umd repo, which will get a Greenkeeper PR on every choo release and will publish a new standalone version on every commit thanks to travis. If this is correct I can create the repo (with some help) and after that maintain it (also anyone on the choo org could)
So, is all of that ok? or were you thinking in another way?

[arturi]

This functionality is actually useful for quick demos and taking a library for a spin, build step is good for production, but shouldn’t be required for starting out.

Here’s an example of someone wanting to use Choo without build-steps: https://twitter.com/louiscenter/status/950312739825647616.

I remember what got me interested in using Hyperapp was their “Try” link and a working demo I could easily tweak: https://codepen.io/hyperapp/pen/zNxZLP, https://unpkg.com/hyperapp. React allows the same.

@goto-bus-stop also reminded me that wzrd.in exists: https://wzrd.in/standalone/choo, https://wzrd.in/standalone/bel.

For the time being, providing a Webpackbin/Codebin example on the readme would be cool, what do you think? Like so: https://codepen.io/anon/pen/mppGjQ and https://www.webpackbin.com/bins/-L2M6H0D7gXX0W9AeIvz.

[yoshuawuyts]

@arturi Sounds good to me!