gobblejs / gobble-browserify

Bundle CommonJS modules with gobble and Browserify
4 stars 9 forks source link

Fix browserify example and add an exampe #2

Closed greglearns closed 10 years ago

greglearns commented 10 years ago

I was confused about how to make the example work because I do not have much experience with Browserify and Gobble, so I would have liked a little example here since Browserify is the main thing I need to get working with Gobble. (Really liking Gobble so far, nice job Rich.)

I also added a little note about running "gobble" instead of "gobble build dist" during debugging since I didn't realize that "gobble build" will swallow the error messages returned by browserify. If you want to reword it, let me know and I can submit a new PR.

Rich-Harris commented 10 years ago

Awesome, thanks! Yeah, I need to add some more examples (and tests!) to all the plugins - hoping to get on that tomorrow.

Sounds like you've found a bug with gobble-cli - it should log errors, not swallow them. Will look into it. Your workaround is the best one in the meantime

greglearns commented 10 years ago

Do you have a very simple example of using gobble-ractive with gobble-browserify? I've been using Ractive for a while, and have been using components, but I want to try using the single-page components with a build step using browserify.

Rich-Harris commented 10 years ago

Yes - this presentation does exactly that (in fact it's the thing I wrote gobble-browserify for!)

https://github.com/Rich-Harris/brooklynjs-sep14

greglearns commented 10 years ago

To answer my own question, this seems to work, given this example directory structure:

Gobblefile.js includes this:

  gobble( 'src' ).map( 'ractive', { type: 'cjs' } ).transform( 'browserify', {
    entries: './javascript/app.js', // can be string or array
    dest: 'bundle.js'
  }),

And javascript/app.js can include things like this:

var SomeComponent = require('../component/some-component');

var thing = new SomeComponent({
  el: '#id-of-the-div-where-this-component-should-be-displayed'
});

I'll put this into a PR for the browserify module. If you want to reject it, then I understand, but I think it would be helpful to others.

Hey, seriously, thank you Rich so much for making Ractive. I've evaluated many other front-end frameworks, and used a few other frameworks extensively, and Ractive has been a joy to work with.

Rich-Harris commented 10 years ago

Thanks for the PR - I figured it probably makes more sense to include that example on the gobble-ractive README since browserify is so general-purpose, so that's what I've done.

And thanks for the kind words and for using Ractive!