4

I know this has been asked in different forms here and also in the angular-cli github, but I couldn't find any helpful answer (and @ngtools/webpack documentation isn't quite complete).

To put it simple, I wanted to test AoT with a fresh app created from angular-cli and using it outside angular-cli, so the steps were:

  1. ng new test-app
  2. ng eject
  3. Minor modifications to the two files involved:
    • webpack.config.js was modified to include an entryModule
    • main.ts was modified to bootstrap a compiled factory module instead of a standard module

I have also deleted the .ngfactory files created when the app is ejected, just to make a fresh clean start.

What happens when I run Webpack? (omitted absolute path details with [...])

ERROR in [...]/test-app/src/main.ts (4,36): Cannot find module './app/app.module.ngfactory'.

ERROR in ./src/main.ts
Module not found: Error: Can't resolve './app/app.module.ngfactory' in '[...]/test-app/src'

But if I previously run the ngc manually, everything works fine, obviously because app.module.ngfactory was generated.

The thing is, it is stated that @ngtools/webpack keeps the generated .ngfactory files in memory and then everything is bundled in the webpack output, makes sense. But I have no idea why it can't find this "in memory" .ngfactory files, and I can't find any way to debug if the paths are not correct or anything else.

Yes, I know that I can build first with ngc and then use Webpack, but that kind of ruins the whole thing about the AoT plugin.

This is the main.ts: https://github.com/JimGV/angularaot/blob/master/src/main.ts

This is the webpack config: https://github.com/JimGV/angularaot/blob/master/webpack.config.js

This is just the plugin config part:

new AotPlugin({
  "hostReplacementPaths": {
    "environments/environment.ts": "environments/environment.ts"
  },
  "entryModule": __dirname + "/src/app/app.module#AppModule",
  "exclude": [],
  "tsConfigPath": __dirname + "/src/tsconfig.app.json",
  "skipCodeGeneration": true
})

I'm on a Mac El Capitan, running node 8.1.1 and Angular 4.2.4 and @ngtools/webpack 1.4.1

Thanks in advance

  • Did you ever resolve this? I have the same issue as you – Spock Jul 24 '17 at 11:38
  • No, still trying when I have time. In the meantime we are compiling the project with `ngc`. –  Jul 26 '17 at 13:35
  • 1
    I solved it by following workaround: npm install --save enhanced-resolve@3.3.0 Apparently there is a bug which requires you to fix that dependency of webpack to that particular version. I run it before every production build.. try it out – Spock Jul 28 '17 at 08:38
  • I'll give it a try as soon as I can, thank you. Also, I've checked the @angular/cli changelog and they made changes on the enhanced-resolve version, so things may be different in newer versions of the cli. (the @angular/cli version when this question was first posted was 1.1.1) –  Jul 29 '17 at 18:48

0 Answers0