Using a node package client-side with requireJS?

Question

I need to parse some CSS files client-side in an app I'm building. There is an excellent npm package that does just that:

https://github.com/NV/CSSOM

I'd like to take this package, smash it into a one file, and load it as a dependency in my requireJS implementation. Essentially, I'd like to use it like this:

//A module in which I'll use CSSOM - I use CommonJS syntax almost exclusively
define( function(require) {
    var $ = require('jquery');
    var CSSOM = require('lib/CSSOM');
});

Full disclosure, I've never actually coded in node.js before (I'd just really like to use this module). What can I do to make this happen?

Answer 1

Loading CSSOM as a non-AMD script

This will give you CSSOM in one file.

CSSOM has instructions to build it as a browser script, from its github site:

$ git clone https://github.com/NV/CSSOM.git
$ cd CSSOM
$ npm install -d
$ ./node_modules/.bin/jake

Based on what I see there, you'd then only need a shim configuration that states:

CSSOM: {
    exports: 'CSSOM'
}

Using r.js

This will give a bunch of modules making up CSSOM. If you'd want a final single file from this, you'd have to ask r.js to optimize the result of ding r.js -convert.

Use r.js to convert the code base of CSSOM:

$ r.js -convert in out

Where in is the source tree of CSSOM and out is where you want to result to be. Because CSSOM says it is pure JS this conversion will probably work without having to do anything else, because I'd expect CSSOM to not use Node-specific modules like fs. But there could be some other problems. If CSSOM, for instance, makes require calls that have a variable rather than a string literal as argument, the converter won't be able to convert it. At any rate, you should have a look at the documentation for details of what could go wrong.