Angular AOT Relative paths in components

Question

I'm asking here because I could't find complete documentation online. The example here is too simple. I've an app with several components and some modules. After compile with ngc, I had lot of errors. The way I found to fix them was use relative paths. So I use 'moduleId: module.id,' in all my components. But now the compiler tells me: ' Cannot find name 'module' '

As I understand, that is becuase I'm declaring the following compile options for AoT:

{
  "compilerOptions": {
    "target": "es5",
   ---> "module": "es2015",
    "moduleResolution": "node",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "removeComments": true,
    "noImplicitAny": true,
    "suppressImplicitAnyIndexErrors": true
  },

  "angularCompilerOptions": {
   "genDir": "aot",
   "skipMetadataEmit" : true
 }
}

Instead of using "module": "commonjs",. How can I fix this?

How can I use relative paths at the same time I want to generate the AOT build?

thanks!

Answer 1

A quick (and maybe dirty) fix is just to write the path directly as a string in the moduleId parameter.

So instead of:

moduleId: module.id

Write:

moduleId: 'path/to/my/app/'

This you can use with Component Relative Paths during development, and when creating the AoT bundle ngc won't complain about not finding module.id.