Vega and Browserify - nyurik/vega GitHub Wiki
This wiki documents Vega version 2. For Vega 3 documentation, see vega.github.io/vega.
When using browserify to build your project, bundled with Vega (through require('vega') appearing somewhere in your code), you need to account for the fact that Vega is also built with browserify. Otherwise, your browserify build step will fail. That's because browserify'ing Vega requires certain modules from Vega's devDependencies to be installed, but those do not get installed by default when you npm install vega (or, equivalently, npm install with vega in your package.json). More info in this issue.
To correct this, you first need to ensure that the applicable Vega devDependencies are installed. The quick and dirty way is to
cd node_modules/vega
npm install --dev
But the better way is to include the necessary modules are in your package.json so that they get installed when you npm install your project.
As of v2.1.2 of Vega, those dependencies are (add these to your package.json, presumably as devDependencies):
"browserify-shim": "^3.8.9",
"browserify-versionify": "^1.0.4",
"jstransform": "^11.0.2",
"through": "^2.3.8",
"watchify": "^3.5.0"
The last item will support using watchify as described here without the browserify-shim errors below.
Next, ensure that your package.json includes a browserify-shim object. It should be at the top level of the package json object (ie as a sibling of dependencies). It's required for the browserify-shim module (a dependency of vega) to run:
"browserify-shim": {}
You should now be able to build successfully.
NOTE: If you don't account for this issue, browserify will throw these or similar errors when building your project:
Error: Cannot find module 'jstransform'
at Function.Module._resolveFilename (module.js:336:15)
at Function.Module._load (module.js:278:25)
at Module.require (module.js:365:17)
at require (module.js:384:17)
at Object.<anonymous> (/example_project/node_modules/vega/scripts/strip-schema.js:5:19)
at Module._compile (module.js:460:26)
at Object.Module._extensions..js (module.js:478:10)
at Module.load (module.js:355:32)
at Function.Module._load (module.js:310:12)
at Module.require (module.js:365:17)
at require (module.js:384:17)
at nr (/example_project/node_modules/browserify/node_modules/module-deps/index.js:280:21)
at onfile (/example_project/node_modules/browserify/node_modules/resolve/lib/async.js:51:21)
at onex (/example_project/node_modules/browserify/node_modules/resolve/lib/async.js:93:22)
at /example_project/node_modules/browserify/node_modules/resolve/lib/async.js:24:18
at FSReqWrap.oncomplete (fs.js:95:15)
or
Error: Unable to find a browserify-shim config section in the package.json for /example_project/node_modules/browserify/node_modules/browser-resolve/empty.js while parsing file: /example_project/node_modules/browserify/node_modules/browser-resolve/empty.js
at /example_project/node_modules/browserify-shim/lib/resolve-shims.js:163:38
at /example_project/node_modules/browserify-shim/node_modules/mothership/index.js:27:31
at testDir (/example_project/node_modules/browserify-shim/node_modules/mothership/node_modules/find-parent-dir/index.js:20:36)
at /example_project/node_modules/browserify-shim/node_modules/mothership/node_modules/find-parent-dir/index.js:26:7
at FSReqWrap.cb [as oncomplete] (fs.js:226:19)