Oh no, an issue has occurred with The Angular Compiler! It appears that TypeScript version 3.9.10 was found instead of the required version, which should be >=3.6.4 and <

After upgrading my angular application from version 5 to version 9, I encountered an issue while trying to deploy my code on the server.

ERROR in The Angular Compiler requires TypeScript >=3.6.4 and <3.9.0 but 3.9.10 was found instead.

Even though my package.json file shows that my typescript version is 3.8.3, this error persists.

I am puzzled as to why this discrepancy is occurring and have provided a snippet of my package.json file and the error below:

Error screenshot

https://i.sstatic.net/fonRL.png

Package.json snippet

https://i.sstatic.net/ERowD.png

I would greatly appreciate any assistance in resolving this issue.

Note: Despite researching solutions on Stack Overflow, none seem to align with my situation given that my package.json file contains the compatible typescript version.

Answer №1

Remove TypeScript package by running: npm uninstall typescript
Then reinstall with the command: npm install <a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="56222f26332535243f26221665786e7865">[email protected]</a> --save-dev

Answer №2

Have you attempted to manually install a specific version?

npm install <a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="7a0e030a1f091908130a0e3a49544d544f">[email protected]</a>  

In your scenario, consider using version 3.8.3.

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

tips for incorporating datatable into ng bootstrap modal within an angular application

I am trying to create a data table within an ng-bootstrap modal in Angular using Bootstrap and the angular-data tables module. My goal is to display the data table specifically within a bootstrap modal. ...

Using React TypeScript, describe the type of ref and mouse event

I am facing an issue with my navbar that I want to hide when clicking outside the sidenav. I came across a useful code snippet that can help me achieve this, but I need to ensure I use the correct types while implementing it in TypeScript. This particular ...

Errors arose due to the deployment of TypeScript decorators

Using TypeScript in a brand new ASP.NET Core project has brought some challenges. We are actively incorporating decorators into our codebase. However, this integration is causing numerous errors to appear in the output of VS2015: Error TS1219 Experim ...

Issue: An object with keys {} is not suitable as a React child, causing an error

I am new to TypeScript and seeking help from the community. Currently, I am working on a to-do list project where I am using React and TypeScript together for the first time. However, I encountered an error that I cannot decipher. Any assistance would be g ...

How can PrimeNG PIE chart values be displayed by default instead of only on hover over the slice?

front end <td> <div class="p-col-8 ui-toolbar-group-right"> <button pButton type="button" icon="pi pi-search" (click)="populate_charts()"></button> </div> </td> TS-File ...

Customizable mongoDB database collection

Is there a more efficient way to make calls to different collections based on a function parameter? I'm exploring the possibility and if it's not feasible, I'll handle it case by case. Currently, I have this code and the goal is to have a u ...

Having an issue in Angular 2 where the correct function is not triggered when a button is placed within a selectable anchor

Within an anchor element, I have a button that triggers its own click listener for an editing popup module. The anchor itself has another click listener assigned to it. For example: <a (click)="onClick(myId)" class="list-group-item clearfix"> < ...

How come Typescript allows me to generate intersection types that seem impossible?

Despite being unimplementable, the type definition below does not trigger any warnings from the compiler. // No type error type impossible = 0 & string[] & 'anything' An item cannot simultaneously be a number, a string[], and a stri ...

Checking for null properties in Typescript objectsorHow to verify if a

What is a simple way to determine if the properties of an object in TypeScript are nullable? For example export default interface UserDto{ ID?:int; USER_NAME?:string; FIRST_NAME?:string; LAST_NAME?:string; USER_ROLE?: ...

Creating components on the fly as soon as their resources become available

I need to dynamically add a child component within another component only after the image inside the child component has been fully loaded. child.component.ts import { Component, OnInit } from '@angular/core'; @Component({ selector: 'a ...

Transferring form state information between parent and child elements

In my development project using Angular 2, I encountered an issue with managing a long and complex form by splitting it into a parent component and two child components for better organization. The challenge arose when I needed to track the form status for ...

Storing information from JSON into an object

I am encountering an issue regarding transferring data from JSON to an object. Although this solution is functional, it is not entirely satisfactory. Take a look at the service. Is there an improved method for handling data conversion from this JSON to an ...

I am unable to locate the module '@schematics/angular/utility/config'

I attempted to execute the command below in order to add ngx-bootstrap to my project: ng add ngx-bootstrap Unfortunately, I encountered an error message. The full CLI output is displayed below: i Using package manager: npm √ Found compatible package ver ...

Error encountered while injecting Angular dependencies in component constructor

Here is my newly created component. I am looking to allow users to adjust the count variable. import { Component, Inject } from '@angular/core'; @Component({ selector: 'app-likebtn', templateUrl: './likebtn.component.html&apos ...

Will the async pipe activate onPush change detection in Angular?

I have searched various sources for the question above, but I am finding conflicting answers. For example, on Angular University's website, it is mentioned that change detection is triggered when the async pipe receives a new observable value. However ...

Transform Loopback 4 filter into a SQL WHERE condition

When using Loopback 4, the filter object that is received by functions like Get and Count appears as shown below: { where: { property: { op: value; } } } I am interested in converting this structure into an SQL WHERE clause to use it in ...

"What is the best way to apply multiple filters to an array in a React

Is there a way to incorporate dropdown menus along with search text input for filtering an array in React? I would like to give users the option to select a location and then search for specific results within that location. Any suggestions on how to ach ...

Placing files in the "Dist" folder is causing an issue by disrupting the functionality of the Angular 2 app

For testing my login component in Angular2, I am using a mockBackend within my app. Initially, the standalone version of the login worked perfectly fine. However, when trying to integrate it into my ongoing development project, I encountered an issue. Duri ...

Encountering an issue when running the command "ng new my-app" after updating the @angular/cli package

npm version 7.5.4 has been detected, but the Angular CLI currently requires npm version 6 to function properly due to ongoing issues. To proceed, please install a compatible version by running this command: npm install --global npm@6. For more information ...

Position the label and the select dropdown side by side within the sweetalert 2 component

Can anyone provide an example of aligning a label and dropdown in the same row using sweetalert2? I attempted to customize the label placement, but it appears on a separate line. I would like to log the selected dropdown item upon clicking the OK button. ...