StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

POHow to manage client-side JavaScript dependencies?
text
Body
copied!<p>Although there are great solutions to manage dependencies on the server side, I could not find any that satisfies all my needs to have a coherent client side JavaScript dependency management workflow. I want to satisfy these 5 requirements:</p> <ol> <li>Manage my client side dependencies in a format similar to npm's <a href="http://package.json.jit.su/" rel="noreferrer">package.json</a> or <a href="http://bower.io/" rel="noreferrer">bower</a>'s <code>bower.json</code></li> <li>It should have the flexibility to point to git repo or actual js files (either on web or locally) in my <code>dependency.json</code> file for lesser known libraries (npm let you point to git repos)</li> <li>It should minify and namespace all libraries into a single file like <a href="http://ender.jit.su/" rel="noreferrer">ender</a> - that's the only js file I would need to put in my <code><script></code> tag in the client side</li> <li>It should have out of box support for CoffeeScript like BoxJS<a href="http://boxjs.com/" rel="noreferrer">4</a> (now dead)</li> <li><p>In the browser, I should be able to use either <a href="http://requirejs.org/" rel="noreferrer">require</a> style:</p> <pre><code>var $ = require('jquery'); var _ = require('underscore'); </code></pre> <p>Or better yet, do <a href="http://headjs.com/" rel="noreferrer">headjs</a> style:</p> <pre><code>head.js(['jquery', 'underscore', 'mylib'], function($, _, mylib) { // executed when all libraries are loaded }); </code></pre></li> </ol> <p>If no one such single tool exists, what is the best combination of tools i.e. a tool-chain that I can combine using something like <a href="http://volojs.org/" rel="noreferrer">volo</a> (or <a href="http://gruntjs.com/" rel="noreferrer">grunt</a>)?</p> <p>I have already researched all the tools I have linked to in here and they satisfy only upto 3 of my requirements at best individually. So, please don't post again about these tools. I would only accept an answer that provides a single tool that satisfies all 5 of my requirements or if someone posts a concrete workflow/script/working example of a toolchain of multiple such tools that also satisfies all my requirements. Thank you.</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload