Angular2 - webpack - Separate modules into more production files

Question

I have a few modules for a regular web visitors. Then, much more modules are used for the app back-office that doesn't have to be loaded with the public site.

What is the right way to create two production bundle files with different modules? I use webpack.

Thanks for any ideas!

Answer 1

There is a way to create chunks of js files.

You'd need to set-up the modules for Lazy Loading, and then configure CanLoad guards for each of the routing branches - Back-office and Public.

That way, there is only one bundle, but only the JS relevant for that particular route is loaded.

You can read a great explanation by Victor Savkin here.