Ok, it's 2016. Webpack looks like a winner against requirejs and browserify. I've been reading about those 3 technologies, to solve a very specific problem. I want to avoid this in my HTML file (part of an AngularJS application)
<script src="some-file.js"></script>
<script src="some-file2.js"></script>
<script src="some-file3.js"></script>
<!-- Dozens of similar lines here... -->
Of course, the order of those lines in my HTML file matters. Bootstrap will ask for jQuery, etc.
First thing I found: requirejs. You just specify something like this:
<script src="my-bundled-file.js"></script>
And then, you solve the dependency problem with JS. Going further, I found 2 approaches here:
- CommonJS (browserify)
- AMD (require.js)
Webpack works with both approaches, which sounds nice.
At the end, the 3 tools can be used for the same thing: bundle several files in only one. But what I'm worried about is the order in which those files are bundled.
I don't want to care about this, and looks like using those solutions (or even gulp + gulp-concat, like is suggested here), 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, even with WebPack (an example here: require calls must be in the correct order)
So, my questions:
- am I misunderstanding these tools? I just want to solve the loading order problem, and looks like I'm not doing it
- do these tools solve a different problem (lack of native modules in ES5, which drives to contaminate the global scope)?