Angular 7: ng serve works, but console shows a Zone.js error and app won't load

redOctober13 picture redOctober13 · Nov 15, 2018 · Viewed 8.6k times · Source

Backstory: I needed to update my app from Angular 5.2.9 to 6 yesterday, and so I thought "why not go to 7 while I'm doing this." So of course that took all day, and required lots of changes to lots of files (mostly because of Rxjs), but in any case, by the end of the day I was able to do ng serve and have it compile with no errors!

But then when I went to localhost:4200 to run the app, it halted on "Loading..." with the following message in the DevTools console:

core.js:14016 Uncaught (in promise) Error: In this configuration Angular requires Zone.js
    at new NgZone (core.js:14016)
    at getNgZone (core.js:14701)
    at PlatformRef.push../node_modules/@angular/core/fesm5/core.js.PlatformRef.bootstrapModuleFactory (core.js:14599)
    at core.js:14643

I've tried to make sure all my packages are up to date. npm install gives some errors around fsevents, but zone is up-to-date.

So I'm at a loss of what to do now. I don't know what the error message is really trying to tell me, or if it's even legit. I did ng new and inspected the generated files, and there's no "zone.js setup" code in there, so I didn't miss something like that. I feel like I was so close to having this update work, but of course if the app won't run, it's no good! Googling for this error message didn't turn up anything useful (to me anyways).

Answer

Mahi picture Mahi · Nov 15, 2018

update every dependency in package.json to latest

npm i -g npm-check-updates
ncu -u
npm install

The error will be gone, even if you get this error . Go to polyfill.ts and add or uncomment :-

/****************************************************************************
 * Zone JS is required by default for Angular itself. */
import 'zone.js/dist/zone';  // Included with Angular CLI.


/**********************************************************************