TS2304: Unable to locate variable '_ZonePrivate'

I'm facing an issue while testing my angular 9 application. When I try to run it using ng serve, it seems to be running fine, but I encounter the error message Cannot GET / when attempting to display the page. The same error persists when I build it with ng build, and the log does not provide any useful information.

ERROR in node_modules/zone.js/lib/browser/event-target-legacy.d.ts:9:67 - error TS2304: Cannot find name '_ZonePrivate'.

9 export declare function eventTargetLegacyPatch(_global: any, api: _ZonePrivate): boolean;
                                                                    ~~~~~~~~~~~~
node_modules/zone.js/lib/browser/event-target-legacy.d.ts:10:54 - error TS2304: Cannot find name '_ZonePrivate'.

10 export declare function patchEvent(global: any, api: _ZonePrivate): void;
                                                        ~~~~~~~~~~~~

Below are the dependencies for my project:

"dependencies": {
  "@angular/animations": "~9.1.12",
  "@angular/cdk": "^9.2.4",
  "@angular/cli": "^9.1.12",
  "@angular/common": "~9.1.12",
  "@angular/compiler": "~9.1.12",
  "@angular/core": "~9.1.12",
  "@angular/forms": "~9.1.12",
  "@angular/localize": "~9.1.12",
  "@angular/material": "^9.2.4",
  "@angular/platform-browser": "~9.1.12",
  "@angular/platform-browser-dynamic": "~9.1.12",
  "@angular/router": "~9.1.12",
  "@angular/service-worker": "^9.1.12",
  "@types/showdown": "^1.9.3",
  "ace-builds": "^1.4.9",
  "bootstrap": "^4.5.2",
  "material-icons": "^0.3.1",
  "ngx-showdown": "^5.1.0",
  "rxjs": "~6.6.0",
  "showdown-highlight": "^2.1.5",
  "tslib": "^1.10.0",
  "zone.js": "~0.10.2"
},
"devDependencies": {
  "@angular-devkit/build-angular": "^0.901.12",
  "@angular/compiler-cli": "~9.1.12",
  "@types/jasmine": "~3.5.0",
  "@types/jasminewd2": "~2.0.3",
  "@types/node": "^12.11.1",
  "codelyzer": "^6.0.0",
  "jasmine-core": "~3.6.0",
  "jasmine-spec-reporter": "~5.0.0",
  "karma": "~5.0.0",
  "karma-chrome-launcher": "~3.1.0",
  "karma-coverage-istanbul-reporter": "~3.0.2",
  "karma-jasmine": "~4.0.0",
  "karma-jasmine-html-reporter": "^1.5.0",
  "protractor": "~7.0.0",
  "ts-node": "~8.3.0",
  "tslint": "~6.1.0",
  "typescript": "~3.8.3"
}

If you require further details, feel free to ask.

angulartypescriptangular-cliangular9zone.js

Answer №1

Encountered a similar issue myself. Decided to remove the import statement from app-routing.module.ts:

import {patchCallbacks} from "zone.js/lib/browser/browser-util";

It wasn't being used, so I just got rid of it.

Surprisingly, that fixed the problem for me.

Not sure if it will work for you too.

Answer №2

If by chance you find that you accidentally brought in something from 'zone.js' (possibly through IDE auto import), simply do a search for the following string

from 'zone.js

or this one

from "zone.js

in your project and delete it if it's not needed.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Is it possible to replace checkboxes with dropdowns in the NG-ZORRO Tree component?

I am attempting to create a tree structure using the tree component from ng-zorro. However, instead of checkboxes for the leaf nodes, I would like to have dropdown menus. I tried using the ng-template but the checkbox is still appearing. Here is my code: ...

angularng-zorro-antd

The billing cycle on the Stripe invoice does not match up

I'm currently in the process of integrating Stripe into my SaaS platform, and I've encountered an issue with calculating the quota based on the payment period. Despite setting the plan as monthly, Stripe is returning a period from the 70s through ...

typescriptstripe-paymentswebhooks

Removing items with properties that are null or undefined

My current situation involves using the AWS SDK, and I've noticed that many of its objects have members that can be undefined. Take for example S3.Object: export interface Object { /** * */ Key?: ObjectKey; /** * * ...

typescript

The interpolated string type is not allowed to be utilized for indexing a record that has the identical type as the key

I'm attempting to utilize an interpolated string form to access a Record type using a key that should match the record's key type. Unfortunately, it doesn't appear to be functioning as expected. Here is a simple example: type TypeOfKey = `c ...

typescript

The incorrect initial state is causing issues in the Zustand state management on the Next.js server side

While utilizing zustand as a global state manager, I encountered an issue where the persisted states were not being logged correctly in the server side of nextjs pages. The log would only show the default values (which are null) and not the updated state v ...

reactjstypescriptnext.jsserver-side-renderingzustand

Refactor the fat arrow function in Typescript to maintain the bare function signature verification

When using AOT in Angular, it is necessary to rewrite all functions and reducers to not utilize arrow functions: An error occurred: Error encountered resolving symbol values statically. Function calls are not supported. Consider replacing the function o ...

angulartypescriptngrxreducers

The "ng2-CKEditor" package is experiencing compatibility issues with TypeScript in Angular 2

Currently, I am in the process of setting up CKEditor in my angular2 application. My backend platform is node.js and for this purpose, I am utilizing the ng2-CKEditor npm module. Below, you can find snippets from respective files. index.html:: <html& ...

node.jsangulartypescriptckeditormean-stack

Sending real-time data from the tRPC stream API in OpenAI to the React client

I have been exploring ways to integrate the openai-node package into my Next.js application. Due to the lengthy generation times of OpenAI completions, I am interested in utilizing streaming, which is typically not supported within the package (refer to he ...

typescriptnext.jsstreamopenai-apitrpc.io

Why am I unable to retrieve the property from the JSON file?

Below is the provided JSON data: data = { "company_name": "חברה לדוגמה", "audit_period_begin": "01/01/2021", "audit_period_end": "31/12/2021", "reports": [ ...

jsontypescript

import error causing an angular application to crash even with the module installed

Is there a possibility that an error is occurring with the import statement even though the syntax is correct and the required library has been installed? Could the issue lie within the core settings files, specifically the ones mentioned below (package.js ...

angulartypescriptvega-litevegavega-embed

Can you use TypeScript to define generic React functional components?

I am looking to add annotations to a generic in a React functional component like the following: import React, {useEffect, useState} from "react"; interface PaginatedTableProps{ dataFetcher: (pageNumber: number) => Promise<any>, columnNames: ...

javascriptreactjstypescripttypescript-genericsreact-typescript

When accessing APIs, create an array of observables for each user call and then trigger a function once all are successfully resolved

As I aim to generate a list of observables while a user engages with the webpage, I am faced with the challenge of individually subscribing to each observable, but desiring another function to execute after individual or multiple simultaneous API calls are ...

angulartypescriptrxjs

Iterate through the array and show the information using Angular

enter image description hereI am a beginner in Angular and I am looking to iterate through an array in Angular. The array contains the following elements: "ticketsdetectives":[10,11,12,13] My goal is to display this data similar to the following ...

arraysangulardisplay

Using parameters in data binding with Angular 5

I have a scenario where I need to categorize and display data fetched from my database in JSON format. The data consists of various columns such as id, name, message, and type. My goal is to organize this data into different div elements based on the conte ...

angular

Determining the return type based on the parameter type

Here is an example of my function: const safeIdCastToNumber = (id: string | null | undefined) => isNil(id) ? id : Number(id) When calling safeIdCastToNumber, I can use an id parameter with a type union string | null | undefined, as well as one with a t ...

typescripttypesnarrowing

Updating Your Child: A Guide

Currently, I have a component that makes reference to a child component with the following code cc: TheChildComponent; @ViewChild('theChildComponent') set details(content: TheChildComponent) { this.cc = content; }; TheChi ...

angularviewchild

trouble seeing images with an array input and ngFor in Angular

I am encountering issues while attempting to exhibit an array of images by their source link using ngFor. It seems like there are errors hindering the functionality! Below is the image HTML code located within my card component: <div class="Session-Pa ...

javascripthtmlarraysangular

Angular: Attempting to coordinate communication between two functions within my service

I have two separate functions but I would like them to sync up and work together. The first function is called getRandomNumbers - its role is to display a random number between 1 and 20 every second. The second function is up - it's a button that al ...

angular

Problem with deploying Angular 2 project on Github

My process began with executing this command: npm i -g angular-cli-ghpages Then, I proceeded to run the following command: ng github-pages:deploy Despite my efforts, I consistently encounter the same message: The specified command github-pages:deploy is ...

angulargithubdeployment

Using a static enum in a different class in TypeScript: A guide

After referencing this question and answer on Stack Overflow about setting a static enum inside a TypeScript class, I decided to create my own enum and implement it as a static property in my class. Here is how I did it: /* Input.ts */ enum INPUT_TYPE { T ...

typescript