CODEWITHSUNDEEP
javascriptjquerynpmbrowserify
Mikko Ohtamaa
Mikko Ohtamaa

Reputation: 83706

Creating a bundle supporting browserify and jQuery <script> tag loading

I am working on a JavaScript library (bitcoin-prices.js) which I'd like to maintain using browserify. The library depends on jQuery. I would not like to force the library users move to browserify, but retain "drop one file + script tag" integration for those who have not drank the latest koolaid from JavaScript community.

My question is how to create a bundle.js with browserify, so that

I guess some kind of boilerplate code is needed around $ = require('jquery.js')?

Upvotes: 6

Views: 1492

Answers (1)

Ian Lim
Ian Lim

Reputation: 4274

The convention is to do like this (without the .js):

var $ = require('jquery')

If you are using grunt-browserify (https://github.com/jmreidy/grunt-browserify),

Compile your library in this way:

  your_task:{
    src:'{{your library's js file}}',
    dest:'{{your library's browserified file}}',
    options: {
      external: ["jquery"]
    }
  },

At the home page, the sequence will then be like this:

<header>
      <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
      <script type="text/javascript" src="{{your library's browserified file}}"></script>
</header>

Hope this helps

Upvotes: 4

Related Questions