Angular-cli: i18n AOT Module not found: Error: Can't resolve './$$_gendir/app/app.module.ngfactory'

[valsorym]

Bug Report or Feature Request (mark with an x)

- [x] bug report -> please search issues before submitting
- [ ] feature request

Versions.

ng

$ ng --version
    _                      _                 ____ _     ___
   / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
  / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
 / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
/_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
               |___/
@angular/cli: 1.2.1
node: 8.2.1
os: darwin x64
@angular/animations: 4.3.3
@angular/common: 4.3.3
@angular/compiler: 4.3.3
@angular/core: 4.3.3
@angular/forms: 4.3.3
@angular/http: 4.3.3
@angular/platform-browser: 4.3.3
@angular/platform-browser-dynamic: 4.3.3
@angular/router: 4.3.3
@angular/cli: 1.2.1
@angular/compiler-cli: 4.3.3
@angular/language-service: 4.3.3

node

$ node --version
v8.2.1

npm

$ npm --version
5.3.0

OS

macOS El Capitan
Darwin 15.5.0 Darwin Kernel Version 15.5.0

Repro steps.

Create test project

$ ng new blog
$ cd blog/
$ ng server

Open http://localhost:4200 in browser - all ok!

Ctrl+C - stop server.

Create localization

$ npm install ngx-i18nsupport --save
$ touch xliffmerge.json
$ vim xliffmerge.json

{
  "xliffmergeOptions": {
    "srcDir": "src/i18n",
    "genDir": "src/i18n",
    "defaultLanguage": "en",
    "languages": ["en", "uk"]
  }
}



md5-5cca88347e8f4b8afdcc4e67d5ead0b6



$ vim src/app/app.component.html



md5-5cca88347e8f4b8afdcc4e67d5ead0b6





md5-2d7cd5edf0792ba9063f9bbe2368e3cc





md5-5cca88347e8f4b8afdcc4e67d5ead0b6





md5-fd9c35d7bac658433fced5905aea825e





md5-fea6ffba312a6241922887921f65afee



$ ng xi18n --output-path src/i18n --locale en
$ xliffmerge --profile xliffmerge.json



md5-387ae7a1355504e67fae470ea2de3370



$ cat src/main.ts
import { enableProdMode } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';

import { AppModule } from './app/app.module';
import { environment } from './environments/environment';

if (environment.production) {
  enableProdMode();
}

platformBrowserDynamic().bootstrapModule(AppModule);



md5-4a1528eb066b744d8af7c4603b1130f2



$ ng server --aot --locale=uk --i18n-format xlf --i18n-file src/i18n/messages.uk.xlf
ERROR in ./src/main.ts
Module not found: Error: Can't resolve './$$_gendir/app/app.module.ngfactory' in '/path/to/blog/src'
 @ ./src/main.ts 3:0-74
 @ multi webpack-dev-server/client?http://localhost:4200 ./src/main.ts



md5-773a26b1c799f83c34d28e6c7a680bfe



$ ng server --aot --locale=uk --i18n-format xlf --i18n-file src/i18n/messages.uk.xlf --env=prod
** NG Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200 **
Hash: 3af33f9cb8c46fdd2a70                                                              
Time: 4745ms
chunk    {0} polyfills.bundle.js, polyfills.bundle.js.map (polyfills) 178 kB {4} [initial] [rendered]
chunk    {1} styles.bundle.js, styles.bundle.js.map (styles) 10.5 kB {4} [initial] [rendered]
chunk    {2} main.bundle.js, main.bundle.js.map (main) 1.1 kB {3} [initial] [rendered]
chunk    {3} vendor.bundle.js, vendor.bundle.js.map (vendor) 1.15 MB [initial] [rendered]
chunk    {4} inline.bundle.js, inline.bundle.js.map (inline) 0 bytes [entry] [rendered]

ERROR in ./src/main.ts
Module not found: Error: Can't resolve './$$_gendir/app/app.module.ngfactory' in '/path/to/blog/src'
 @ ./src/main.ts 3:0-74
 @ multi webpack-dev-server/client?http://localhost:4200 ./src/main.ts

What solution?

Sources

Angular-CLI Internationalization (i18n)

Angular Internationalization (i18n)

Ahead-of-Time Compilation

Issues 4551

Issues 5596

[valsorym]

Solved!
Need to use the latest version of @angular/cli

Update @angular/cli

$ npm uninstall -g angular-cli
$ npm uninstall --save-dev angular-cli
$ rm -rf node_modules dist
$ npm cache clean
$ npm install -g @angular/cli@latest
$ npm install --save-dev @angular/cli@latest
$ npm install 

Ng version

$ ng --version
    _                      _                 ____ _     ___
   / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
  / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
 / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
/_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
               |___/
@angular/cli: 1.2.7
node: 8.2.1
os: darwin x64
@angular/animations: 4.3.3
@angular/common: 4.3.3
@angular/compiler: 4.3.3
@angular/core: 4.3.3
@angular/forms: 4.3.3
@angular/http: 4.3.3
@angular/platform-browser: 4.3.3
@angular/platform-browser-dynamic: 4.3.3
@angular/router: 4.3.3
@angular/cli: 1.2.7
@angular/compiler-cli: 4.3.3
@angular/language-service: 4.3.3

Run

$ng serve --aot --locale=uk --i18n-format xlf --i18n-file src/i18n/messages.uk.xlf
...
webpack: Compiled successfully.

All starts normal

[m98]

I had the same problem, I used the Manually removing residual Angular CLI guide, but it did not work for me, in my case, it was because I used sudo when I wanted to install Angular CLI globally, and for uninstalling it I needed to use sudo again:

sudo npm uninstall -g @angular/cli

[finalxcode]

sudo npm uninstall -g @angular/cli
use @angular/[email protected] solved my problem!

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{_This action has been performed automatically by a bot._}