On part 2
we explored how to work with libraries including a a named AMD
In this article, we’ll explore how to work with libraries via npm and browserify.
Browserify is a Node library which allows us
to consume other Node libraries in the Browser using CommonJS (which
is Node’s module system), what this means is that we can install
libraries like MomentJS using npm and then consume them in the browser
via browserify. But wait, to use Browserify we actually need to
install the library and create a “bundle” with our
dependencies, normally we’ll run something like
browserify main.js -o
bundle.js and then use
bundle.js via a script tag
As we can imagine this can get tricky and hard to manage in our ember-cli application, but thanks to Edward Faulkner there is addon which allow us to consume libraries from npm with browserify without needing us to worry about the bundling process, it is called ember-browserify.
First we need to install the addon, which we can do running
$ ember install:addon ember-browserify
Once the addon has been installed, we are going to use it to consume
MomentJS from npm in our
Before doing that, let’s make sure we have removed
moment from our
bower.json and also that we have removed
app.import('bower_components/moment/moment.js'); from the
Next, let’s install moment via npm, which we can do with
Once it has been installed we can consume it from npm thanks to
ember-browserify just doing
import moment from 'npm:moment';.
Let’s use it in our
And that’s it, we are now consuming MomentJS via browserify just as if it was other module in our application.