Angular 4 AOT with webpack

Question

I use 4 with angular webpack 2 and try to use the AOT, but it gives me this error: 10% building modules 4/5 modules 1 active ..._modules/intl/locale-data/jsonp/en.jsModuleNotFoundError: Module not found: Error: Can't resolve './../$$_gendir/src/app/app.module.ngfactory' in '/Users/xyz/angular-upgrade/backend/myapp/angular/src'.

This is mine webpack.config:

new AotPlugin({
  tsConfigPath: './tsconfig.json',
  entryModule: './src/app/app.module#AppModule'
}),

and the script I use to make the assembly: "build": "rimraf dist && webpack --config config/webpack.prod.js --progress --profile --bail"

Below is mine tsconfig.json:

{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "moduleResolution": "node",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "lib": ["es2015", "dom"],
    "noImplicitAny": false,
    "suppressImplicitAnyIndexErrors": true
  },
  "exclude": [
    "node_modules",
    "bower_components"
  ]
}

Answer 1

AOT does not support typescript version that is higher than 2.0.10. You must make sure of this. In addition, you need to change some angular modules, such as http, the platform browser or the kernel, back to angular 2 - I use version 2.4.0 - because typescript version 2.0.10 or lower does not support them!

Answer 2

: @ngtools/webpack. Angular.

, , tsconfig.json Angular A cookbook

. :

"module": "es2015"

, ngc, ,

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

Answer 3

$$_gendir

per --bail cli , $$_gendir , .