angular-cli: ng build -prod Module not found: Error: Can't resolve './$$_gendir/app/app.module.ngfactory'

Instead of use ng build --prod use ng build --env=prod

UPDATE

As many of us (thx) have mention, this doesn’t build with aot so, it’s the same that the plain ng build at the end (as says @adessilly ng build --env=prod : replace environment.ts by environment.prod.ts, but it’s a simple ng build. ng build --prod : improved build with aot + environment.prod.ts replacement (before, it was ng build --prod --aot) )

The most easy workaround (at least for me), was to create a new whole project with the last Angular CLI version, and moves the src folder. It’s no straight forward, so please read the migration guide and don’t forget to make a backup before.

Migration guide

Similar problem with 1.0.0-rc1 on Windows. Running ng build --prod gives

ERROR in Error encountered resolving symbol values statically. Could not resolve events relative to C:/Projects/craft-ng/editor/node_modules/blocking-proxy/built/lib/webdriver_commands.d.ts., resolving symbol WebDriverCommand in C:/Projects/craft-ng/editor/node_modules/blocking-proxy/built/lib/webdriver_commands.d.ts

ERROR in ./src/main.ts Module not found: Error: Can’t resolve ‘./$$_gendir/app/app.module.ngfactory’ in ‘C:\Projects\craft-ng\editor\src’ @ ./src/main.ts 4:0-74 @ multi ./src/main.ts

ng build --prod --aot=false executes without problems.

FYI this issue is the top result in google for the error but I think the more relevant one is: https://github.com/angular/angular-cli/issues/7113

edit:

the workaround of npm install enhanced-resolve@3.3.0 worked for me.

try to add aot option, so build command will be like this : ng build -prod --aot=false

This may or may not be helpful but I have noticed that the first error seems to be the primary cause and the Module not found error is generic and will happen any time something breaks the aot build.

In my case I was getting the following any time I had an empty scss file:

ERROR in Child compilation failed:
Module build failed: No input specified: provide a file name or a source string to process:
[object Object]

ERROR in ./src/main.ts
Module not found: Error: Can't resolve './$$_gendir/app/app.module.ngfactory' in '/Users/mhamel/Development/blispay/blispay-ui2/src'
 @ ./src/main.ts 4:0-76
 @ multi ./src/main.ts

As soon as I fixed the first error, the Module not found error resolved itself. From that, I would expect @IlyaSurmay and @agarbutt each have different project specific bugs. (Possibly aot compiler related)

Can you see if the --verbose flag gives you any more information about the error?

+1 (on Windows 10 64bits)

@angular/cli: 1.2.4 fix the problem

unresolved, --env produces not the same output as --prod

This is seriously frustrating. My builds have just randomly stopped working with no clue in the error why. Even if I create a new project it breaks:

[swarman:/tmp/test] $ ng new testing
installing ng
  create .editorconfig
  create README.md
  create src/app/app.component.css
  create src/app/app.component.html
  create src/app/app.component.spec.ts
  create src/app/app.component.ts
  create src/app/app.module.ts
  create src/assets/.gitkeep
  create src/environments/environment.prod.ts
  create src/environments/environment.ts
  create src/favicon.ico
  create src/index.html
  create src/main.ts
  create src/polyfills.ts
  create src/styles.css
  create src/test.ts
  create src/tsconfig.app.json
  create src/tsconfig.spec.json
  create src/typings.d.ts
  create .angular-cli.json
  create e2e/app.e2e-spec.ts
  create e2e/app.po.ts
  create e2e/tsconfig.e2e.json
  create .gitignore
  create karma.conf.js
  create package.json
  create protractor.conf.js
  create tsconfig.json
  create tslint.json
Installing packages for tooling via npm.
Installed packages for tooling via npm.
Successfully initialized git.
Project 'testing' successfully created.
[swarman:/tmp/test] 47s $ cd testing/
[swarman:/tmp/test/testing] master 130 ± ng build --aot
Hash: c1b5f2a65555bd40d721                                                              
Time: 4136ms
chunk    {0} polyfills.bundle.js, polyfills.bundle.js.map (polyfills) 177 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.09 kB {3} [initial] [rendered]
chunk    {3} vendor.bundle.js, vendor.bundle.js.map (vendor) 849 kB [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 '/tmp/test/testing/src'
 @ ./src/main.ts 3:0-74
 @ multi ./src/main.ts

version info:

[swarman:/tmp/test/testing] master 130 ± ng --version
    _                      _                 ____ _     ___
   / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
  / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
 / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
/_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
               |___/
@angular/cli: 1.2.3
node: 7.9.0
os: linux x64
@angular/animations: 4.3.1
@angular/common: 4.3.1
@angular/compiler: 4.3.1
@angular/core: 4.3.1
@angular/forms: 4.3.1
@angular/http: 4.3.1
@angular/platform-browser: 4.3.1
@angular/platform-browser-dynamic: 4.3.1
@angular/router: 4.3.1
@angular/cli: 1.2.3
@angular/compiler-cli: 4.3.1
@angular/language-service: 4.3.1

Having the same failure on both linux and windows platforms.

ERROR in Cannot read property 'map' of undefined

ERROR in ./src/main.ts
Module not found: Error: Can't resolve './$$_gendir/app/helix-app.module.ngfactory' in 'C:\Users\agarbutt\WebstormProjects\helix-ui\src'
 @ ./src/main.ts 3:0-85
 @ multi ./src/main.ts

main.ts

import {platformBrowserDynamic} from "@angular/platform-browser-dynamic";
import {enableProdMode} from "@angular/core";
import {environment} from "./environments/environment";
import {HelixAppModule} from "./app/";

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

platformBrowserDynamic()
  .bootstrapModule(HelixAppModule)
  .catch(err => console.error(err));

The issue is reproducible again since today morning.

Here is the result of ng version: @angular/cli: 1.2.3 node: 6.10.3 os: win32 x64 @angular/animations: 4.3.1 @angular/common: 4.3.1 @angular/compiler: 4.3.1 @angular/core: 4.3.1 @angular/forms: 4.3.1 @angular/platform-browser: 4.3.1 @angular/platform-browser-dynamic: 4.3.1 @angular/router: 4.3.1 @angular/cli: 1.2.3 @angular/compiler-cli: 4.3.1 @angular/language-service: 4.3.1

The real issue is the horrendous error messaging when AOT building fails. My AOT is failing, surely because of my fault, but I have no idea why. How can we print out the error?

The same for me. Our builds stopped working since today morning. I decided to check it with just created application via ‘ng new TestProject’ and then ‘ng build --prod --aot’ and it produces the error like was mentioned in the post above: ‘Module not found: Error: Can’t resolve ‘./$$_gendir/app/app.module.ngfactory’’

ng --version produces the following response: @angular/cli: 1.2.3 node: 6.10.1 os: win32 x64 @angular/animations: 4.3.1 @angular/common: 4.3.1 @angular/compiler: 4.3.1 @angular/core: 4.3.1 @angular/forms: 4.3.1 @angular/http: 4.3.1 @angular/platform-browser: 4.3.1 @angular/platform-browser-dynamic: 4.3.1 @angular/router: 4.3.1 @angular/cli: 1.2.3 @angular/compiler-cli: 4.3.1 @angular/language-service: 4.3.1

In the current night I found perfect solution: remove everything, remove npm, remove node_modules. Burn them all! Dracarys! Then go to install npm, install angular-cli, have a good day

@angular/cli: 1.2.4 fix the problem

There were two ways I could fix this- 1] Updating typescript to latest npm install --save typescript@latest 2] make the aot flag false ng build --prod --aot=false

6 months and no official solution???

Same here. My project just stopped compiling today morning:

@angular/cli: 1.2.3 node: 8.2.1 os: linux x64 @angular/animations: 4.3.1 @angular/common: 4.3.1 @angular/compiler: 4.3.1 @angular/core: 4.3.1 @angular/forms: 4.3.1 @angular/http: 4.3.1 @angular/platform-browser: 4.3.1 @angular/platform-browser-dynamic: 4.3.1 @angular/router: 4.3.1 @angular/cli: 1.2.3 @angular/compiler-cli: 4.3.1

@WiL-dev - I’m not sure ng build --env-prod builds with aot like ng build --prod does. If I run ng build --env=prod the tool generates the same size for my output as ng build --env=dev does. In addition running ng build --env=prod --aot=true gnerates the same error that I was origially getting. Unexpected value 'null' exported by the module 'MyModule' && down the stack Error: Can't resolve './$$_gendir/app/app.module.ngfactory'

This leads me to suspect that the cli tool is fine and it’s my app that needs some updates before it can be --aot compiled.

Something I’ll look into when I have a bit of time.

Why does enhanced-resolve fix it though? (yes, it fixes it for me too, but I want to know why)

This is still a problem. It happens even with the newly created project from ng new!

Full output:

d:\Temp\cli>ng -v
    _                      _                 ____ _     ___
   / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
  / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
 / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
/_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
               |___/
@angular/cli: 1.0.0
node: 6.9.1
os: win32 x64

d:\Temp\cli>ng new cli-test
installing ng
  create .editorconfig
  create README.md
  create src\app\app.component.css
  create src\app\app.component.html
  create src\app\app.component.spec.ts
  create src\app\app.component.ts
  create src\app\app.module.ts
  create src\assets\.gitkeep
  create src\environments\environment.prod.ts
  create src\environments\environment.ts
  create src\favicon.ico
  create src\index.html
  create src\main.ts
  create src\polyfills.ts
  create src\styles.css
  create src\test.ts
  create src\tsconfig.app.json
  create src\tsconfig.spec.json
  create src\typings.d.ts
  create .angular-cli.json
  create e2e\app.e2e-spec.ts
  create e2e\app.po.ts
  create e2e\tsconfig.e2e.json
  create .gitignore
  create karma.conf.js
  create package.json
  create protractor.conf.js
  create tsconfig.json
  create tslint.json
Successfully initialized git.
Installing packages for tooling via npm.
Installed packages for tooling via npm.
Project 'cli-test' successfully created.

d:\Temp\cli>cd cli-test

d:\Temp\cli\cli-test>ng build --prod --env=prod
Hash: 0bfde11b73d9b21b101b
Time: 6189ms
chunk    {0} polyfills.7fd9b43f06a670d8299a.bundle.js (polyfills) 158 kB {3} [initial] [rendered]
chunk    {1}  (styles) 1.72 kB {3} [initial] [rendered]
chunk    {2} main.e1bb4892ef6fedc166cd.bundle.js (main) 806 kB [initial] [rendered]
chunk    {3} inline.65cd0835207a2ba3e811.bundle.js (inline) 0 bytes [entry] [rendered]

ERROR in E:/Temp/cli/cli-test/src/main.ts
Module not found: Error: Can't resolve './d:/Temp/cli/cli-test/src/$$_gendir/app/app.module.ngfactory' in 'E:\Temp\cli\cli-test\src'
 @ E:/Temp/cli/cli-test/src/main.ts 4:0-99
 @ multi ./src/main.ts

d:\Temp\cli\cli-test>

Running angular 4.0.0

upgrading @angular/cli to v1.2.5 with npm install --save @angular/cli@1.2.5

Updating to @angular/cli@1.2.6 fixed the problem for me.

I’m having this issue too, I just created the app, made a “hello world” and I can’t build it for production on Linux Mint 18.1 Serena. yarn add enhanced-resolve@3.3.0 --dev didn’t help…

ERROR in ./src/main.ts
Module not found: Error: Can't resolve './$$_gendir/app/app.module.ngfactory' in '/home/filipe/Workspace/AppName/src'
 @ ./src/main.ts 3:0-74
 @ multi ./src/main.ts

@angular/cli: 1.2.4
node: 6.11.1
os: linux x64
@angular/animations: 4.3.1
@angular/common: 4.3.1
@angular/compiler: 4.3.1
@angular/core: 4.3.1
@angular/forms: 4.3.1
@angular/http: 4.3.1
@angular/platform-browser: 4.3.1
@angular/platform-browser-dynamic: 4.3.1
@angular/router: 4.3.1
@angular/cli: 1.2.4
@angular/compiler-cli: 4.3.1
@angular/language-service: 4.3.1

Edit:

this works ng build --aot=false -prod

@angular/cli: 1.2.4 didn’t fix it. enhanced-resolve: 3.3.0 fixes it.

This is how I fixed my issues with the last version of angular-cli : https://medium.com/@isaacplmann/making-your-angular-2-library-statically-analyzable-for-aot-e1c6f3ebedd5#.n4b11wso1

With the last version of angular-cli, ng build --prod seems to compile with --aot by default : I didn’t know there was good practices to make project working with…

I got the same problem using 1.1.2 and the problem was that enhanced-resolve package is upgraded 3.4.x from 3.3.x

angular-cli@1.2.6 addresses this issue. you can also pin enhanced-resolve to 3.3.0 in devDependencies in your package.json

Fixed by enhanced-resolve@3.3.0 on Mac

Same issue. Here is my environment.

@angular/cli: 1.0.3 node: 6.11.1 os: darwin x64 @angular/common: 4.3.1 @angular/compiler: 4.3.1 @angular/core: 4.3.1 @angular/forms: 4.3.1 @angular/http: 4.3.1 @angular/platform-browser: 4.3.1 @angular/platform-browser-dynamic: 4.3.1 @angular/router: 4.3.1 @angular/cli: 1.0.3 @angular/compiler-cli: 4.3.1

enhanced-resolve: 3.3.0 fixed my issue.

@ervivekmahajan please read all the comments asap

Just change

“@angular/cli”: “1.0.0”

from devDependencies to

“@angular/cli”: “1.3.0”

run npm install and it should be fine.

I FINALLY got it to work for me. Unbelievable it was because my entryModule path to the AppModule was incorrect. I fixed that and it works! Days of recreating my app from scratch, line by line, file by file, and it was a such as simple mistake but hard to notice.

If the compiler gave better error message, it would have saved me a LOTTTTT of time. Just saying “no appModule found at entryModule path, check that path is correct” would help.

https://github.com/angular/angular-cli/commit/dbc7959503604af077c0fa1ada4d60643e5ab399 Fixes it by pinning enhanced-resolve@3.3.0

I have fixed this issue in my project.

In my case, I have found two reasons:

1. I used jade template. You can’t use jade with AOT.

// My component.

@Component({ 
  selector: 'app-some-component', 
  template: require('jade-loader!./some-component.jade')(),  // <--- This will break AOT bundling.
  styleUrls: ['./some-component.styl'] 
}) 
export class SomeCompoonent implements OnInit {
  // ...
}

How to fix: bring html back or turn off AOT.

2. Export an anonymous function by using export default will break AOT bundling.

// my-utils.ts

export default function () {  // <--- This will break AOT bundling too.
  // ...
}

How t fix: give it a name or turn off AOT.

// my-utils.ts

export deafult function myUtils () {  // Yeah! Everything is fine!
  //...
}

+1 linux mint

ERROR in this._input.charCodeAt is not a function

ERROR in ./src/main.ts
Module not found: Error: Can't resolve './$$_gendir/app/app.module.ngfactory' in '/home/vs/Work/GoFactTables/GoFactFrontend/src'
 @ ./src/main.ts 5:0-74
 @ multi ./src/main.ts

my previous @angular/cli@1.2.0 had conflict with npm packages.

– upgrade global angular-cli to @latest

npm uninstall -g angular-cli npm cache clean npm install -g @angular/cli

your-angular-project-dir> npm install --save-dev @angular/cli@latest

after upgrade to @lastest, all works

@angular/cli: 1.2.4 fix the problem for me whereas installing enhanced-resolve didn’t

@angular/cli: 1.2.4 doesn’t fix the problem for me. npm install enhanced-resolve@3.3.0 fixes it temporarily

fixed my error with AppModule not a NgModule by updating typescript

npm install --save typescript@latest `

I know this call is closed, but its the first link I found when googling, so here is my solution.

ERROR in ./src/main.server.ts
Module not found: Error: Can't resolve './app/app.server.module.ngfactory'

Using Angular 7.1.4, reason was I enabledIvy after upgrading from 6 to 7.

"angularCompilerOptions": {
  "enableIvy": true
} 

Removed the flag and all was good.

Ivy is still in Beta and should not be used in production see issue 21706

This command is 100% work for solving this problem. npm install enhanced-resolve@3.3.0

Currently using: / \ _ __ __ _ _ | | __ _ _ __ / | | | | / △ \ | ’ \ / _ | | | | |/ _ | '| | | | | | | / ___ | | | | (| | || | | (| | | | || | | | // __| ||_, |_,||_,|| _||| |___/

Angular CLI: 1.7.4 Node: 8.9.0 OS: win32 x64 Angular: 5.1.0 … animations, common, compiler, compiler-cli, core, forms … http, language-service, platform-browser … platform-browser-dynamic, router

@angular/cdk: 5.2.5 @angular/cli: 1.7.4 @angular/material: 5.2.5 @angular-devkit/build-optimizer: 0.3.2 @angular-devkit/core: 0.3.2 @angular-devkit/schematics: 0.3.2 @ngtools/json-schema: 1.2.0 @ngtools/webpack: 1.10.2 @schematics/angular: 0.3.2 @schematics/package-update: 0.3.2 typescript: 2.5.3 webpack: 3.11.0

BUT while doing AOT build it is giving me following error help required! Thanks!

I am working on an app based on the ASP.NET Core Angular template, which does not come with AngularCLI. I had this error only on publishing the solution, without no other information. Turns out I moved the app.browser.module.ts and app.server.module.ts files from the app folder to app/modules and I forgot to update the new entryModule paths (thanks @tenderloin420 ) in the AngularCompilerPlugin/AotPlugin sections in webpack.config.js. The publishing worked once I corrected the paths.

ng build --prod --aot false

This solved my problem.

It is not a solution though.

Later,

• I updated the cli again
• Followed the error messages and fixed them Now there’s no complain

npm i --save @angular/cli@1.2.4

and changed package.json scripts to:

"scripts": {
    "ngstart": "ng serve",
    "start": "node server.js",
    "postinstall": "ng build --aot -prod",
    ...
  }

For some reason enhanced-resolve: 3.3.0 fixes it for my on windows, but not on linux. It’s the same version of npm and node on both machines. Any help is greatly appreciated.

@WiL-dev : I can confirm it works fine on 1.0.0-rc1. Thanks!

I just ran into the same issue. Since we switched to aot build for development, this issue was troubling. And in my case it was caused by a previous fix involving angularCompilerOptions in the tsconfig.app.json:

I basically had

before - not working

{
  "compilerOptions": {
    "sourceMap": true,
    "declaration": false,
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "noImplicitAny": true,
    "lib": [
      "es2016",
      "dom"
    ],
    "outDir": "../out-tsc/app",
    "target": "es5",
    "module": "es2015",
    "baseUrl": "",
    "types": []
  },
  "angularCompilerOptions": {
    "annotateForClosureCompiler": false,
    "skipMetadataEmit" : true,
    "skipTemplateCodegen": true
  },
  "exclude": [
    "test.ts",
    "**/*.spec.ts"
  ]
}

removing the angularCompilerOptions solved the issue:

working

{
  "compilerOptions": {
    "sourceMap": true,
    "declaration": false,
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "noImplicitAny": true,
    "lib": [
      "es2016",
      "dom"
    ],
    "outDir": "../out-tsc/app",
    "target": "es5",
    "module": "es2015",
    "baseUrl": "",
    "types": []
  },
  "exclude": [
    "test.ts",
    "**/*.spec.ts"
  ]
}

With this config, we can use the ng serve with aot: "start": "ng serve --aot --proxy-config proxy.conf.json"

I had the same problem, just followed official document to update to the last version of angular-cli solved the problem. There are two steps.

To update Angular CLI to a new version, you must update both the global package and your project’s local package.

Global package:

npm uninstall -g @angular/cli
npm cache clean
# if npm version is > 5 then use `npm cache verify` to avoid errors (or to avoid using --force)
npm install -g @angular/cli@latest

Local project package:

rm -rf node_modules dist # use rmdir /S/Q node_modules dist in Windows Command Prompt; use rm -r -fo node_modules,dist in Windows PowerShell
npm install --save-dev @angular/cli@latest
npm install

Ref: https://github.com/angular/angular-cli#updating-angular-cli

After trying different permutations of different versions of everything, I FINALLY got this figured out and I couldn’t believe the reason. A while back, in order to get my dev build/serve working, I had to add **/*.d.ts to the include array in my tsconfig, otherwise I got all kinds of “cannot find name” errors. I did not realize that the reason that was happening was because tsconfig.app.json was generated by the CLI with an empty types array, so even though the base tsconfig.json specified the correct “typeRoots” directory, the empty types array was causing the errors. Even though adding **/*.d.ts to the include array fixed dev build/serve errors, it was the reason for the prod build error in this issue. Removing that and the empty types array in tsconfig.app.json allowed me to build both dev and prod successfully. Hopefully this will help somebody else.

Installing @angular/cli@1.2.6 fix this

remove everything, remove npm, remove node_modules. Burn them all! Dracarys!

"nukeInstall": "rm -rf node_modules && npm cache clean --force && npm install"

@BOPOHOB On that note, I added this to my package.json scripts about a month ago. Works very well for that.

It worked for me installing @angular/cli@1.2.6 with angular 4

“@angular/common”: “^4.0.0”, “@angular/compiler”: “^4.0.0”, “@angular/core”: “^4.0.0”, “@angular/forms”: “^4.0.0”, “@angular/http”: “^4.0.0”, “@angular/platform-browser”: “^4.0.0”, “@angular/platform-browser-dynamic”: “^4.0.0”, “@angular/router”: “^4.0.0”

The new angular-cli version (@angular/cli@1.2.6) fix the problem for me.

Also for me, I uninstalled the temporary enhanced-resolve@3.3.0, then installed @angular/cli@1.2.6 $ npm uninstall enhanced-resolve@3.3.0 $ npm install @angular/cli@1.2.6

@jotatoledo using Angular 1.2.4 does not fix the problem for me unless enhanced-resolve is pinned to 3.3.0. To reproduce:

npm version 5.3.0

• remove global npm cache directory (to simulate a brand new build)
• npm i @angular/cli@1.2.4
• ng new testing
• in testing directory: npm install && ng build --prod
• got the “module not found error”
• npm i enhanced-resolve@3.3.0
• ng build --prod works now
• but package.json lists ‘enhanced-resolve’ version as ‘^3.3.0’
• remove global npm cache, node_modules and package-lock.json (to simulate a brand new build)
• npm build -prod fails again, because it pulls in enhanced-resolve 3.4.1.

My fix is to change my project’s package.json to pin the enhanced-resolve to 3.3.0, remove node_modules and package-lock.json again, and ng build --prod works again.

I am using "@ngtools/webpack": "1.5.3" and can confirm the enhanced-resolve workaround did not solve my issue.

Came across the issue, neither the emergency release or enhanced resolve have solved the problem until now 😦

For me it was having “rootDir” in my tsconfig.json … (I needed to remove it)

Check your tsconfig: “angularCompilerOptions”: { “entryModule”: “src/app/app.server.module#AppServerModule” }

entryModule should have proper app module path

@KhizerRehan same CLI v1.7.4 here, the only major difference being the operating system (Fedora 28).

If I’m not mistaken, this is the latest v1.* series launched to this day, but the bug persists.

This was a frustrating one… Especially since I had this issue months ago, solved it and then totally forgot the fix and then saw it pop up again in another project.

In my case neither upgrading the CLI or installing enhanced resolve 3.3.0 fixed the issue.

For me it was simply a casing issue. All of our apps are kept under an ‘Apps’ folder, but in both my Webpack entry and ngtools aot entryModule, I had the folder in lowercase as ‘apps’.

Hopefully that helps someone else and also future me 😃

update npm install enhanced-resolve@3.3.0 for me it’s working fine

Hi all,

After run of “ng build --prod” I have this issue: “ERROR in ./src/main.ts Module not found: Error: Can’t resolve ‘./$$_gendir/app/app.module.ngfactory’”

I have Angular CLI 1.5.0. My main.ts:

import { platformBrowserDynamic } from ‘@angular/platform-browser-dynamic’; import { enableProdMode } from ‘@angular/core’;

import { AppModule } from ‘./app/app.module’;

enableProdMode(); platformBrowserDynamic().bootstrapModule(AppModule);

what is wrong here, how to fix this issue?

Updating your packages, especially Angular CLI and Webpack fixed the problem for me. Try that and see the difference. Am using “@angular/cli”: “^1.5.0”, and “webpack”: “^3.8.1”

I am facing same issue. I have angular cli 1.5.0

Angular CLI: 1.5.0 Node: 8.9.0 OS: darwin x64 Angular: 5.0.0 … animations, common, compiler, core, forms, http … language-service, platform-browser, platform-browser-dynamic … platform-server, router

@angular/cli: 1.5.0 @angular/compiler-cli: 4.4.6 @angular/tsc-wrapped: 4.4.6 @angular-devkit/build-optimizer: 0.0.32 @angular-devkit/core: 0.0.20 @angular-devkit/schematics: 0.0.35 @ngtools/json-schema: 1.1.0 @ngtools/webpack: 1.8.0 @schematics/angular: 0.1.0 typescript: 2.6.1 webpack: 3.8.1

Go into node_modules/webpack/ directory then install enhanced-resolve@3.3.0 work for me.

problem

There is no 'enhanced-resolve' package in my package.json, and not in the root of the node_modules. So I run yarn add enhanced-resolve@3.3.0 --dev, then ng build --prod still not work. then I checked package list by run yarn list, I find enhanced-resolve@3.3.0 in package.json from @angular-cli/webpack but enhanced-resolve@3.4.1 installed in the webpack. So I go into the webpack directory and force install enhanced-resolve@3.3.0, then it’s work for me.

@IRCraziestTaxi you can put entryModule on either your webpack config or your typescript config. Make sure the tsConfigPath points to the proper location of your tsconfig file. Also, the tsconfig settings are VERY picky, below I copied my entire working file so try that as is before modifying anything.

// webpack config

const ngToolsWebpack = require('@ngtools/webpack');

// webpack loader

          { test: /\.ts$/, loader: ['@ngtools/webpack'] },

// webpack plugin

      new ngToolsWebpack.AotPlugin({
         tsConfigPath: './tsconfig.ngtools-webpack.json',
         entryModule: helpers.root('src/app-components/app/app.module') + '#AppModule', // here
         debug: true
      }),

// tsconfig.ngtools-webpack.json

{
   "compilerOptions": {
      "allowSyntheticDefaultImports": true,
      "baseUrl": ".",
      "emitDecoratorMetadata": true,
      "experimentalDecorators": true,
      "importHelpers": true,
      "lib": [
         "dom",
         "es2015"
      ],
      "module": "es2015",
      "moduleResolution": "node",
      "noEmit": true,
      "noEmitHelpers": true,
      "paths": {
         "@angular/*": [
            "./node_modules/@angular/*"
         ]
      },
      "sourceMap": true,
      "sourceRoot": ".",
      "strictNullChecks": false,
      "target": "es5",
      "typeRoots": [
         "./node_modules/@types"
      ],
      "types": [
         "hammerjs",
         "node"
      ]
   },
   "exclude": [
      "./node_modules",
      "./wwwroot",
      "../backend-nodejs",
      "./src/**/*.e2e.ts",
      "./src/**/*.spec.ts"
   ],
   "angularCompilerOptions": {
      "genDir": "./compiled",
       "entryModule": "src/app-components/app/app.module#AppModule", // or here
      "skipMetadataEmit": true
   },
   "atom": {
      "rewriteTsconfig": false
   },
   "awesomeTypescriptLoaderOptions": {
      "forkChecker": true,
      "useWebpackText": true
   },
   "buildOnSave": false,
   "compileOnSave": false
}

@sirius77cc Can you show us the relevant package versions? Angular, ngtools, cli if you use it, etc.

Also sometimes I like to delete the node_modules folder and clear the cache npm cache clear -f just to be sure I got all the right versions when installing… may be overkill.

@Itisfilipe that definitely works as @pbalaga and later @wassimsidia said. The problem with that hack is that you don’t have the benefits of AOT(Faster rendering, Fewer asynchronous requests, Smaller Angular framework download size, Detect template errors earlier, Better security). The main difference:

AOT, the compiler runs once at build time using one set of libraries; with JIT it runs every time for every user at runtime using a different set of libraries.

Some guides to fix it correctly: First from @adessilly

Second - This one is a simple angular cli fix from @WiL-dev. I from my point of view that is not the case of the majority.

And the First Which is an article that explains basically:

A lambda assigned to a const is a function expression, not a function declaration. ngc interprets them as different things because it only analyses code statically.

const lambda => export function default export => named export moduleId should be set on components with templateUrl dynamic component template => static template private, protected accessors should be changed to public for any members accessed from template

from @awerlang

@angular/cli: 1.2.4 fix the problem for me too. I discovered that running ng serve or ng build --prod or running ng test

All produced (slightly different)ts compile errors because there are some stricter checks that are been done since the upgrade (for instance template checks are done).

But now we resolved all these errors, the project builds again and all tests pass!

npm i @angular/cli@1.2.4 did the trick for me. It has enhanced-resolve@3.3.0 as its dependency.

1.3.0.rc-1 and 1.2.4 should fix the issue without trick install of enhanced -resolve, but you need to install them with npm. For yarn users there is another problem apparently

I’v that problem too, use ng new create a project and use ng build --prod，and it fails.

ERROR in ./src/main.ts
Module not found: Error: Can't resolve './$$_gendir/app/app.module.ngfactory' in '/Users/baidu/apps/device-monitor/src'
 @ ./src/main.ts 3:0-74
 @ multi ./src/main.ts

@angular/cli: 1.1.3 node: 6.9.5 os: darwin x64 @angular/animations: 4.3.1 @angular/common: 4.3.1 @angular/compiler: 4.3.1 @angular/core: 4.3.1 @angular/forms: 4.3.1 @angular/http: 4.3.1 @angular/platform-browser: 4.3.1 @angular/platform-browser-dynamic: 4.3.1 @angular/router: 4.3.1 @angular/cli: 1.1.3 @angular/compiler-cli: 4.3.1 @angular/language-service: 4.3.1

I’ve started receiving this error all of the sudden as well, and my build hasn’t changed. Seems like whatever is causing it happened in the last week or so.

@russkayairina it’s a normal behavior :
ng build --env=prod : replace environment.ts by environment.prod.ts, but it’s a simple ng build. ng build --prod : improved build with aot + environment.prod.ts replacement (before, it was ng build --prod --aot).

To make your project working with aot, follow these steps : https://medium.com/@isaacplmann/making-your-angular-2-library-statically-analyzable-for-aot-e1c6f3ebedd5#.n4b11wso1

The same thing happens for me. No error other than:

ERROR in ./src/client.aot.ts Module not found: Error: Can't resolve './$$_gendir/browser.module.ngfactory' in '/home/pradej/Projekty/site-backoffice/src' @ ./src/client.aot.ts 2:0-75

I had to make a separate, plain client entry point for AOT, but it still doesn’t work.

import { enableProdMode } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';

import { MainModule } from './browser.module';

enableProdMode();

platformBrowserDynamic().bootstrapModule(MainModule);

OS: Fedora 25 x64

Also, if that’s helpful, my project is using Universal, but AOT is used for client only.