Webpack configuration and lazy loaded modules

Hi there! Love the work you’ve done with the new ionic :slight_smile:

I am trying to figure out how to build my app. I have around 15 pages that are lazy loaded in the app with decorator Ionic App, these pages have services and other common dependencies, however when I build the app these dependencies end upp in all of the lazy loaded js files.

I would like to have the common dependencies in one file or in the main.js. Can i configure the webpack to do that? I have an custom webpack.config and generated one vendor.file.

Blow away all the “*.module.ts” files, eliminate the IonicPageModule decorators on all your pages, put all your pages in your app module, and use class names instead of strings in your interaction with navigation. This opts you out of lazy page loading.

But I want the files to lazyload.

I just want the common dependencies not to repeat themselves in every lazy loaded file.

If I specify that these dependencies should be in the vendor. bundle, its is removed from all lazy loaded files and just referenced. However it would be nice to have it somewhere else than in the vendor.file (since all libs files is in there)

Me too, but there are a lot of things I want and can’t have. Until somebody fixes ng-cli #2771, we’re stuck here AFAIK.

1 Like