Ben Elliott Ben Elliott - 1 month ago 12
TypeScript Question

Angular AOT/ngc duplicates route definitions

I'm having some trouble setting up ahead-of-time compilation for my lazy-loaded Angular app.

Lazy-loaded routes are defined in an

app.routes.ts
file which is imported by
app.module.ts
. When I run
ngc
the contents of
app.routes.ts
are inlined into
app.module.ngfactory.ts
, but this file also includes an import of the original
app.module.ts
, which then imports
app.routes.ts
again and so on...

When I then bundle the AOT app with Webpack I get a duplication of my route definitions (which use
angular2-router-loader
), with relative paths that do not resolve on one of the two instances (since one is inlined and lives at a different level of my directory tree).

How do I resolve this? It seems strange to me that
ngc
generates an import of the original
app.module.ts
file in
app.module.ngfactory.ts
but I don't know how to prevent it.

Answer

In case anyone finds this question, I solved the problem by settingangular2-router-loader's genDir option to the directory within my genDir directory that contains the source files for my compiled application.

The documentation for this option has now been clarified with an example.