Browserify-loader NPM

browserify-loader

A CommonJS Loader for browserify workflow ES6 support.

What is browserify-loader

browserify-loader is another CommonJS loader for browserify workflow. With BL, You don’t need any tools like watchify, browserify-middleware to auto build and serve bundle *js in development env.

browserify-loader is similar with requirejs, but:

follow Modules/1.1.1 like Node
get rid of wrapper code like define()
be compatible all npm package and all bower components witch support CommonJS. like underscore, backbone, jQuery and so on.

Getting start

install

Download browserify-loader with npm or bower:

$ npm install browserify-loader

Put browserify-loader.js in your page:

<!DOCTYPE html>
<html>
<head>
  <title></title>
</head>
<body>
    <script type="text/javascript"
      src="node_modules/browserify-loader/browserify-loader.js"></script>
</body>
</html>

Then, browserify-loader will start to run for main file in your package.json file.

options

browserify-loader has two options to specify the main script or package location. and browserify-loader supports coffee-script.

    <script type="text/javascript"
        id="bl-script"
        main="backbone/app.js"
        package="backbone/"
        extensions="js json 6.js jsx"
        src="node_modules/browserify-loader/browserify-loader.js"></script>

main: the main entrance script like app.js in node app.js
package: the location where browserify-loader to load package.json， then get the main entrance from main property.
extensions: the enable extensions you want basing on your source code. browserify-loader now supports .js，.6.js(ES6), json and jsx(for react fans).

main 's priority is higher the package 's.

example

Look into todomvc-in-bl , which is a demo project based on todomvc to show how to use browserify-loader.

API

define

The internal wrapper API.

define.registerExtension

var to5Transform = require('6to5/lib/6to5/transformation/transform')

define.registerExtension('jsx', function(script) {
  return to5Transform(script, {modules: "common"}).code
})