1 | # CommonJS Everywhere
|
2 |
|
3 | CommonJS (node module) browser bundler with source maps from the minified JS bundle to the original source, aliasing for browser overrides, and extensibility for arbitrary compile-to-JS language support.
|
4 |
|
5 | ## Install
|
6 |
|
7 | npm install -g commonjs-everywhere
|
8 |
|
9 | ## Usage
|
10 |
|
11 | ### CLI
|
12 |
|
13 | $ bin/cjsify --help
|
14 |
|
15 | Usage: cjsify OPT* path/to/entry-file.ext OPT*
|
16 |
|
17 | -a, --alias ALIAS:TO replace requires of file identified by ALIAS with TO
|
18 | -h, --handler EXT:MODULE handle files with extension EXT with module MODULE
|
19 | -m, --minify minify output
|
20 | -o, --output FILE output to FILE instead of stdout
|
21 | -r, --root DIR unqualified requires are relative to DIR; default: cwd
|
22 | -s, --source-map FILE output a source map to FILE
|
23 | -v, --verbose verbose output sent to stderr
|
24 | -w, --watch watch input files/dependencies for changes and rebuild bundle
|
25 | -x, --export NAME export the given entry module as NAME
|
26 | --deps do not bundle; just list the files that would be bundled
|
27 | --help display this help message and exit
|
28 | --ignore-missing continue without error when dependency resolution fails
|
29 | --inline-source-map include the source map as a data URI in the generated bundle
|
30 | --inline-sources include source content in generated source maps; default: on
|
31 | --node include process object; emulate node environment; default: on
|
32 | --version display the version number and exit
|
33 |
|
34 | *Note:* use `-` as an entry file to accept JavaScript over stdin
|
35 |
|
36 | *Note:* to disable an option, prefix it with `no-`, e.g. `--no-node`
|
37 |
|
38 | #### Example:
|
39 |
|
40 | Common usage
|
41 |
|
42 | ```bash
|
43 | cjsify src/entry-file.js --export MyLibrary --source-map my-library.js.map >my-library.js
|
44 | ```
|
45 |
|
46 | Watch entry file, its dependencies, and even newly added dependencies. Notice that only the files that need to be rebuilt are accessed when one of the watched dependencies are touched. This is a much more efficient approach than simply rebuilding everything.
|
47 |
|
48 | ```bash
|
49 | cjsify -wo my-library.js -x MyLibrary src/entry-file.js
|
50 | ```
|
51 |
|
52 | Use a browser-specific version of `/lib/node-compatible.js` (remember to use `root`-relative paths for aliasing). An empty alias target is used to delay errors to runtime when requiring the source module (`fs` in this case).
|
53 |
|
54 | ```bash
|
55 | cjsify -a /lib/node-compatible.js:/lib/browser-compatible.js -a fs: -x MyLibrary lib/entry-file.js
|
56 | ```
|
57 |
|
58 | ### Module Interface
|
59 |
|
60 | #### `cjsify(entryPoint, root, options)` → Spidermonkey AST
|
61 | Bundles the given file and its dependencies; returns a Spidermonkey AST representation of the bundle. Run the AST through `escodegen` to generate JS code.
|
62 |
|
63 | * `entryPoint` is a file relative to `process.cwd()` that will be the initial module marked for inclusion in the bundle as well as the exported module
|
64 | * `root` is the directory to which unqualified requires are relative; defaults to `process.cwd()`
|
65 | * `options` is an optional object (defaulting to `{}`) with zero or more of the following properties
|
66 | * `export`: a variable name to add to the global scope; assigned the exported object from the `entryPoint` module. Any valid [Left-Hand-Side Expression](http://es5.github.com/#x11.2) may be given instead.
|
67 | * `aliases`: an object whose keys and values are `root`-rooted paths (`/src/file.js`), representing values that will replace requires that resolve to the associated keys
|
68 | * `handlers`: an object whose keys are file extensions (`'.roy'`) and whose values are functions from the file contents to either a Spidermonkey-format JS AST like the one esprima produces or a string of JS. Handlers for CoffeeScript and JSON are included by default. If no handler is defined for a file extension, it is assumed to be JavaScript.
|
69 | * `node`: a falsey value causes the bundling phase to omit the `process` stub that emulates a node environment
|
70 | * `verbose`: log additional operational information to stderr
|
71 | * `ignoreMissing`: continue without error when dependency resolution fails
|
72 |
|
73 | ## Examples
|
74 |
|
75 | ### CLI example
|
76 |
|
77 | Say we have the following directory tree:
|
78 |
|
79 | ```
|
80 | * todos/
|
81 | * components/
|
82 | * users/
|
83 | - model.coffee
|
84 | * todos/
|
85 | - index.coffee
|
86 | * public/
|
87 | * javascripts/
|
88 | ```
|
89 | Running the following command will export `index.coffee` and its dependencies as `App.Todos`.
|
90 |
|
91 | ```
|
92 | cjsify -o public/javascripts/app.js -x App.Todos -r components components/todos/index.coffee
|
93 | ```
|
94 |
|
95 | Since the above command specifies `components` as the root directory for unqualified requires, we are able to require `components/users/model.coffee` with `require 'users/model'`. The output file will be `public/javascripts/app.js`.
|
96 |
|
97 | ### Node Module Example
|
98 |
|
99 | ```coffee
|
100 | jsAst = (require 'commonjs-everywhere').cjsify 'src/entry-file.coffee', __dirname,
|
101 | export: 'MyLibrary'
|
102 | aliases:
|
103 | '/src/module-that-only-works-in-node.coffee': '/src/module-that-does-the-same-thing-in-the-browser.coffee'
|
104 | handlers:
|
105 | '.roy': (roySource, filename) ->
|
106 | # the Roy compiler outputs JS code right now, so we parse it with esprima
|
107 | (require 'esprima').parse (require 'roy').compile roySource, {filename}
|
108 |
|
109 | {map, code} = (require 'escodegen').generate jsAst,
|
110 | sourceMapRoot: __dirname
|
111 | sourceMapWithCode: true
|
112 | sourceMap: true
|
113 | ```
|
114 |
|
115 | ### Sample Output
|
116 |
|
117 | ![](http://i.imgur.com/oDcQh8H.png)
|