Should I use Browserify or Webpack for lazy loading of dependencies in angular 1.x

Nikos picture Nikos · May 12, 2014 · Viewed 14.7k times · Source

I would like to have async loading of angular dependencies in a large application and I'm trying to decide between Browserify or Webpack for this. I know angular 2.0 will support this natively but for now I'm looking for a well supported and popular solution.

Can anyone give advice on which ones works best in an angular team and the most optimal way to structure the project.

Answer

Jeff Ling picture Jeff Ling · Jul 22, 2014

At my company, we've switched over from browserify to webpack for a multitude of reasons, lazy loading being one of them.

Putting things in multiple bundles in browserify took some configuration changes as well as special code. Here is a great guide for that http://esa-matti.suuronen.org/blog/2013/04/15/asynchronous-module-loading-with-browserify/

With webpack, adding a new bundle just means an extra entry file line in the configuration's entry file line. Here is a quick guide to that: https://github.com/petehunt/webpack-howto#7-multiple-entrypoints. In the case of lazy-loading, you don't even need to change anything in the configuration file, which is awesome - just use the asynchronous require syntax detailed here: https://github.com/petehunt/webpack-howto#9-async-loading

Here is a template for a setup very similar to what we use at https://bench.co in production. https://github.com/jeffling/angular-webpack-example/