We are developing an AngularJS application. We using webpack for bundling dependencies and ui.router for routing behaviour.
Since the output file is getting huge over time, we want to split all areas (admin, settings, orders etc.) in separate files and load them if needed in the specific area (=lazyload them).
With webpack chunk splits we can split the areas into different files, but how can we load them lazy and make sure that the routing work properly?
Thank you for your ideas :-)
Matt Strom
Software Engineer, TypeScript ninja
There is a special Webpack plugin for splitting out NgModules from your project. The easiest way is to just use the Angular CLI, which has this baked in already. If you can't use the CLI, you could still create a basic project, eject that project (i.e.
ng eject) and see how it's done in the ejected configuration file.