Requirejs vs browserify vs webpack for js loading order: am I just moving the situation from one side to another?
<p>Ok, it's 2016. <a href="https://webpack.github.io/">Webpack</a> looks like a winner against <a href="http://requirejs.org/">requirejs</a> and <a href="http://browserify.org/">browserify</a>. I've been reading about those 3 technologies, to solve a very specific problem. <strong>I want to avoid this in my HTML file (part of an AngularJS application)</strong></p>

<pre><code>&lt;script src="some-file.js"&gt;&lt;/script&gt;
&lt;script src="some-file2.js"&gt;&lt;/script&gt;
&lt;script src="some-file3.js"&gt;&lt;/script&gt;
&lt;!-- Dozens of similar lines here... --&gt;
</code></pre>

<p>Of course, <strong>the order of those lines in my HTML file matters</strong>. Bootstrap will ask for jQuery, etc. </p>

<p>First thing I found: requirejs. You just specify something like this:</p>

<pre><code>&lt;script src="my-bundled-file.js"&gt;&lt;/script&gt;
</code></pre>

<p>And then, you solve the dependency problem with JS. Going further, I found 2 approaches here:</p>

<ul>
<li>CommonJS (browserify)</li>
<li>AMD (require.js)</li>
</ul>

<p>Webpack works with both approaches, which sounds nice.</p>

<p>At the end, the 3 tools can be used for the same thing: <strong>bundle several files in only one</strong>. But what I'm worried about is <strong>the order in which those files are bundled</strong>. </p>

<p>I don't want to care about this, and looks like using those solutions (or even gulp + gulp-concat, like is suggested <a href="https://medium.com/@dickeyxxx/best-practices-for-building-angular-js-apps-266c1a4a6917#.v0t56k8rb">here</a>), <strong>I'm just moving the problem: now, I specify the modules which my application uses with JS code, but I still need to put the modules in the correct order</strong>, even with WebPack (an example <a href="http://www.shmck.com/webpack-angular-part-2/">here</a>: <code>require</code> calls must be in the correct order)</p>

<p>So, my questions:</p>

<ul>
<li><strong>am I misunderstanding these tools? I just want to solve the loading order problem, and looks like I'm not doing it</strong></li>
<li><strong>do these tools solve a different problem (lack of native modules in ES5, which drives to contaminate the global scope)?</strong></li>
</ul>