Document installing and using npm modules in client dir #287

Closed
pygy opened this Issue Aug 25, 2012 · 8 comments

Projects

None yet

5 participants

@pygy
Contributor
pygy commented Aug 25, 2012

This is a very handy feature of browserify that SS does not support at the moment.

I tried to make a node_modules symlink to the system directory. The libs install as expected, but the direcoty hierarchy is flatened and all .js files are provided as-is. For example, if you install node-uuid, require("node-uuid") fails, but require("uuid.js") does. I also get a slew of errors 500 for non-js files included in the node-uuid directory.

This isn't a problem for the uuid module, since it is comprised of just one file, but more complex modules, or modules relying on other npm modules won't work at all.

There are a lot of pure JS npm packages that can be useful client side too...

@pygy
Contributor
pygy commented Aug 26, 2012

I built a quick workaround.

Put this as ss-npmclient.js at the root of your project, add the relevant module names in the modules array, and run it.

It will compile everything and put it in client/code/system/npm.js. From your client code, you can then

npm = require("npm");
uuid = npm["node-uuid"];

All modules referenced in the script below end up in the npm namespace.

As it is now, it picks the modules from the node_modules directory at the root of your project. It could be easily adapted to use a custom set.
It requires browserify to be installed system-wide, and will require some modifications to run on Windows.

TODO: morph it into a full-fledged npm module that extracts info from package.json.

ss-npmclient.js

#! /usr/bin/env node

modules = ["node-uuid"];
dest = "client/code/system/npm.js";
brfcmd = "browserify"
tmpfile = "________ss_npmclient.tmp";

fs = require("fs");
cp = require("child_process");

exp = [];

for (_i = 0, _len = modules.length; _i < _len; _i++) {
  m = modules[_i];
  exp.push("exports[\"" + m + "\"] = require (\"" + m + "\");");
}

fs.writeFileSync(tmpfile, exp.join("\n"));

br = cp.execFile(brfcmd, [tmpfile]);
src = [];
br.stdout.on("data", function(data) {
  src.push(data);
});

br.on("exit", function(code) {
  src = src.join("");
  pattern = /require\(\"________ss_npmclient\.tmp\"\);\n\}\)\(\);/;
  fs.writeFileSync(dest, src.replace(pattern, "module.exports = $&"));
  fs.unlinkSync(tmpfile);
});
@paulbjensen
Contributor

I think that this is definitely worth doing, and will therefore suggest it goes into 0.4

@paulbjensen paulbjensen added this to the 0.4 milestone Feb 1, 2015
@arxpoetica
Member

Referencing ticket #465 as there are overlapping considerations.

@kulicuu
Member
kulicuu commented Feb 3, 2015

I want to work on this feature and the whole client bundling module devvs, after doing the connect stuff, which I'm working on this week.

@paulbjensen
Contributor

@kulicuu cool, please do. Thanks.

@thepian
Member
thepian commented Feb 6, 2015

I'm adding a minor modification as part of #465 which allows referencing any code relative to the client folder. That takes care of bower if you include it in client. Not sure about npm if node_modules remain in the project root.

@thepian
Member
thepian commented Mar 11, 2015

You can now do that with what is in the next branch. We just need an example/documentation.

@thepian thepian changed the title from Feature request: support for client-side npm-installed modules to Document installing and using npm modules in client dir Mar 11, 2015
@thepian thepian closed this Mar 15, 2015
@thepian thepian referenced this issue Mar 15, 2015
Closed

Make 0.4.x ready for release #507

19 of 32 tasks complete
@thepian
Member
thepian commented Mar 15, 2015

@kulicuu If you want to work on this you should pick up #455

It would be really neat, but I think it could easily be left for past 0.4, perhaps 0.4.2, assuming 0.4.1 are fixes based on feedback

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment