ionic-framework: Module not found: Error: Can't resolve './app.module.ngfactory' ionic-angular 3.9.0

Try run this command

$ ./node_modules/.bin/ngc

It will show the detail error part in your code, it saved my life trying to find what was causing the error. May this can help you.

Here are the general instructions that were sent around to testers and some early adopters that we asked to test out the next release:

1. Blow away node_modules and package-lock.json
2. Set Typescript to ~2.4.2
3. Set Angular to 5.0.0
4. Set @ionic/app-scripts to nightly
5. Set ionic-angular to nightly
6. Set @ionic/storage to 2.1.3
7. Set rxjs to 5.5.2
8. Run npm install

Double check that all of that was done on your project that is failing.

I have the same issue, removing node_modules, package lock file and www build folder doesn’t resolve for me the issue!

It could be we have some providers or something else which at the moment we don’t have loaded in some module. But it would be impossible find the file on hundreds and hundreds of files

i downgraded angular from “5.0.0” to “4.4.4” it worked fine…just change the value of all angular dependencies in package.json and do npm install…hope it helps. Also make sure all pages you have are added to the Ng Module. Hack on!

I think I got it, the problem is there are several errors, with always the same error message and ionic serve does work always correct which is the BIG problem

if you have a look on this a) don’t have components, providers or directives in project which are not included in a module b) don’t use *directives which are not imported in module, there is no error message for that c) don’t import Modules in project which are not available, no error message d) refetor your rxjs to 5.5 e) check you lib if they are incompatible with ng5 most of the incompatibility is RxJS in ng5

Probably you think, all this point are for sure. But the big problem is most of the cases ionic serve run without error and in ionic build you have always the same error, so it is nearly impossible to find the errors, we take 2 days to discover all this errors.

All this errors can and can not be discovered by ionic serve, it depends on the combination of the errors. For example if there problems with directives the rxjs problems are not discovered.

I think I can reproduce this behavior also on an empty stupid new project

@thiagosantos I actually had to downgrade from

"@ionic/app-scripts": "3.1.5",

to

"@ionic/app-scripts": "3.1.2",

But the real problem I had came from the aot which seems to be unable to link something from the UI to the controller (such as a private value used in the template). To find them (commit your changes first) run

./node_modules/.bin/ngc

Then

ionic cordova build android --prod

Will show all the possible code errors.

I also had as suggested @kensodemann to upgrade rxjs to 5.5.2 and change:

-import { Observable } from 'rxjs/Rx';
+import { Observable } from 'rxjs/Observable';

I might have found the solution. Check on your directory tree if you have some pages / provider / etc that are not referenced in app.module. In my case, I still had the default pages/home folder, but I had deleted it from app.modules.ts I am still investigating on another app, I’ll give you further feedback.

Hi guys,

I had the same problem and this is how I resolve it:

1. First, as you said, change all your RXJS imports from:

OLD: import { Observable } from 'rxjs/Rx';
GOOD: import { Observable } from 'rxjs/Observable';

OLD: import { Subscription } from 'rxjs/Rx;
GOOD: import { Subscription } from 'rxjs/Subscription';

(and so on)

1. When you run --prod, the console doesn’t give you the exact error. To solve it, run:

./node_modules/.bin/ngc

And you will get the real errors. Note that after update Ionic to the latest version (which uses the latest version of Angular), you have to be careful with private and public variable declarations. I had the same issue with Angular aswell.

The most common issues that I had was problems about private and public declarations, and also when use NGRX I cant export reducers using arrow functions, I’ve to use the functions in old way, I mean:

Instead of arrow function:

export const myreducer = () => {  return ...... }

I had to use:

export function myreducer() { return .....}

Once you have all your issues, run

ionic cordova run android --prod

And it should work. Hope it helps.

Module not found: Error: Can’t resolve ‘./app.module.ngfactory’ ionic-angular

this error also occurs when import an angular-ionic page which having module.ts file as sibling. also do not import any ionic page which having @IonicPage() decorator.

In - app.module.ts

import {LoginPage} from ‘…/pages/login/login’; //wrong #having a module.ts file as sibling in source tree

also don’t add decorator as

@IonicPage() //wrong – this is only for lazy loading @Component({ selector: ‘page-login’, templateUrl: ‘login.html’, }) export class UserdashboardPage {}

component that are to be loaded as lazy so don’t import them in app.module.ts

Hi there, For everyone running this issue take a look on Dan comment at https://github.com/ionic-team/ionic-app-scripts/issues/1309#issuecomment-343990321

This may help

We have too many open issues pertaining to this one issue. I am going to close this one (and others) and leave the following issue open: https://github.com/ionic-team/ionic-app-scripts/issues/1309

Reason: This particular issue list is for issues with the Ionic Framework itself. All of these issues so far seem to have two components:

1. User code needs changing to match the correct way to do things with the newer libraries (mostly rxjs related, it seems)
2. Code builds fine without --prod gives not exactly helpful error with --prod

The latter issue may have something to do with Ionic tooling, but may also have more to do with tooling further down the chain. That is being investigated, but that is more closely related to @ionic/app-scripts which is why I am leaving that issue open.

This just consolidates things so we are not discussing the same issue in several different threads.

Please follow up with further info here: https://github.com/ionic-team/ionic-app-scripts/issues/1309

i created a new project and started copy my files with plugins. updated rxjs as per 5.5.2. project is working till now. but when ever i install “npm install ionic2-auto-complete --save” component. it is creating the given issue to me. " Can’t resolve ‘./app.module.ngfactory’"

@matoos32 update these ones to latest 4.4.0.may it could work for you .ionic-native/core ionic-native/splash-screen ionic-native/status-bar

@kensodemann I had problem for 2 days, but I just had to refactor rxjs. I am almost certain that people don’t know how to do it. I spent today 6 hours refactoring code and made it work. I posted what I did here #2893

I’m getting the error too upgrading to Angular 5 and running ionic build --prod. I also get the error using only ionic build --aot. On the plus side, these are running successfully:

• ionic build --minifyjs
• ionic build --minifycss
• ionic build --optimizejs
• ionic build --optimizejs --minifyjs --minifycss

Is --prod a short-form for --aot --optimizejs --minifyjs --minifycss, or does it give you something extra?

RE: @joeldavuk

…deleting node_modules and package-lock.json and the build folder for good measure, then running npm install resolved this for me.

I deleted all my project’s repo contents (safe for /.git/) and did a git reset --hard to restore vanilla code. Also ensured package-lock.json was deleted. Did an npm install and then ionic build --prod continued to fail with the same error.

RE: @bogomips

I started to copy, 1 to 1, every single file from my project to a new one … Anyway, so far, I am compiling with --prod (in the new project) and everything works fine.

I inspected my app.module.ts vs. the project file-system and didn’t notice anything stale. Will keep an eye out, though.

package.json:

  "dependencies": {
    "@angular/common": "5.0.0",
    "@angular/compiler": "5.0.0",
    "@angular/compiler-cli": "5.0.0",
    "@angular/core": "5.0.0",
    "@angular/forms": "5.0.0",
    "@angular/http": "5.0.0",
    "@angular/platform-browser": "5.0.0",
    "@angular/platform-browser-dynamic": "5.0.0",
    "@ionic-native/core": "3.12.1",
    "@ionic-native/splash-screen": "3.12.1",
    "@ionic-native/status-bar": "3.12.1",
    "@ionic/storage": "2.1.3",
    "cordova-android": "^6.2.3",
    "cordova-plugin-console": "^1.0.5",
    "cordova-plugin-device": "^1.1.4",
    "cordova-plugin-splashscreen": "^4.0.3",
    "cordova-plugin-statusbar": "^2.2.2",
    "cordova-plugin-whitelist": "^1.3.1",
    "ionic-angular": "3.9.2",
    "ionic-plugin-keyboard": "^2.2.1",
    "ionicons": "3.0.0",
    "rxjs": "5.5.2",
    "sw-toolbox": "3.6.0",
    "zone.js": "0.8.18"
  },
  "devDependencies": {
    "@ionic/app-scripts": "^3.1.0",
    "typescript": "2.4.2"
  },

ionic info:

cli packages: (<somewhere>\node_modules)

    @ionic/cli-utils  : 1.18.0
    ionic (Ionic CLI) : 3.18.0

global packages:

    cordova (Cordova CLI) : 7.1.0

local packages:

    @ionic/app-scripts : 3.1.0
    Cordova Platforms  : android 6.4.0
    Ionic Framework    : ionic-angular 3.9.2

System:

    Android SDK Tools : 26.0.2
    Node              : v6.11.2
    npm               : 3.10.10
    OS                : Windows 10

Environment Variables:

    ANDROID_HOME : F:\android-sdk

Misc:

    backend : legacy

@morrisonbrett I started to copy, 1 to 1, every single file from my project to a new one. To a certain point (in the new project) I’ve got the error, it was generated from the pages/Home present on my src/ but never referenced on my app.modules (I had deleted it). I did not finish the process yet, 'cause in the meanwhile I am cleaning and refactoring some code, I am switching to lettable operators in rxjs, etc, etc Anyway, so far, I am compiling with --prod (in the new project) and everything works fine. My feeling is the in the older project has some dead folder not actually used but that in someway they are taken in consideration from the compiler that searches for all .ts files. I’ll be sure of it as soon as I finish this process, but I will address you guy to this direction. I hope I’ve been cleaner now.