Encountering an issue saving files in Angular 2 when the npm server is active

Encountering an issue when trying to save .ts or .html files while npm is running

 1: DoJoin(aka DoJoin) [native array.js:~129] [pc=0000035BB365DBB2] 
(this=0000005A3F604381 <undefined>,w=000003CB8840CFF1 <JS 
Array[104]>,x=104,N=0000005A3F6043C1
 <true>,J=000000DB8B0DB361 <String[2]: , >,I=0000005A3F6B46F1 <JS Function 
ConvertToString (SharedFunctionInfo 0000005A3F652DC9)>)
2: Join(aka Join) [native array.js:180] [pc=0000035BB3A1FB52] 
(this=0000005A3F604381 <undefined...
FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory
angulartypescriptangular-cli

Answer №1

In case angular-cli doesn't have enough memory allocated, you can increase it by making changes to the ng.cmd (or sh depending on your operating system) located at 

C:\Users\%userName%\AppData\Roaming\npm
. Here is how you can do it:

@IF EXIST "%~dp0\node.exe" (
  "%~dp0\node.exe" --max_old_space_size=8048 "%~dp0\node_modules\@angular\cli\bin\ng" %*
) ELSE (
  @SETLOCAL
  @SET PATHEXT=%PATHEXT:;.JS;=;%
  node --max_old_space_size=8048 "%~dp0\node_modules\@angular\cli\bin\ng" %*
)

(Please note that paths may vary based on your particular system)

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 there a method to improve type inference in vscode?

Recently, I created a component with a click handler that looks like this: onClick={(e) => { e.stopPropagation(); }} It seems clear to me, but then the Typescript compiler complains that it's not a valid signature for onClick, which actually a ...

typescript

My goal is to access data from an array that is stored in MySQL, with the data containing latitude and longitude values

I need to extract latitude and longitude values separately from a Laravel5 database. $vehiclelocation=Vehicle::select('veh_last_location')->get()->toArray(); dd($vehiclelocation[0]['veh_last_location']); The response I am curren ...

mysqlangular

Prioritizing the validation of form controls takes precedence over redirecting to a different URL in Angular 2

Within an HTML page, there is a form with validation and an anchor tag as shown below: <form #loginForm="ngForm" (ngSubmit)="login()" novalidate> <div class="form-group"> <label for="email">Email</label> <i ...

htmlangularangular2-routingangular-validation

Using Typescript in a definition file requires classes and interfaces to be included in the compiled .js file

I am currently working on a Typescript project that consists of two crucial files: app.ts models.d.ts The initial lines of code in app.ts are as follows: ///<reference path="models.d.ts"/> 'use strict'; import * as fs from 'async-f ...

node.jstypescriptvisual-studio-2017typescript-2.5

Troub3leshooting Circular Dependency with Typescript, CommonJS & Browserify

I am currently in the process of transitioning a rather substantial TypeScript project from internal modules to external modules. The main reason behind this move is to establish a single core bundle that has the capability to load additional bundles if an ...

typescriptcircular-dependencybrowserifycommonjs

Ng5 npm is encountering an error stating 'Module './topologicalSort' could not be located.'

I encountered an issue with my Angular 5 app. Whenever I attempt to run it, I receive the following error message after running an npm start. Error: Cannot find module './topologicalSort' I suspect that this issue is related to 'webpac ...

node.jsangular

Utilize Angular 9 to fetch data from an API using the Get method, map them to a class, and

Seeking to extract information from a test URL and convert the data into a list, I aim to exhibit them in an alert/Loop for testing purposes. The dummy API URL being used is: The returned data follows this structure: {"status":"success","data":[{"id":"1" ...

angulartypescript

Perplexed by the implementation of "require(...)" in TypeScript

After reading several blog posts, my understanding of TypeScript modules remains confusing. I have worked with three different modules (all installed via npm) and encountered varying behavior: (1) Importing and using Angular 2 from npm required me to add ...

npmtypescriptphaser-framework

How to use Web3 in conjunction with a Paymaster to execute a smart contract transaction and have the Paymaster cover the gas fees?

Seeking a method to call a smart contract function using web3js in an Angular 17 project, with gas fees covered by a paymaster-contract. How can I make this happen? web3 version: 4.6.0 Angular Version: 17 network: zkSync const web3 = new Web3(window ...

angularblockchainsmartcontractsweb3js

Can you explain the function and purpose of the <template> element in Angular 2?

Within the angular2 control file, specifically on line 91, there is a unique tag called <template>. What purpose does this tag serve? ...

angular

How can I pass custom QueryParams to Router's NavigationExtras in Angular and create a personalized navigation experience?

I am currently working on implementing data filtering functionality in my Angular application. The concept is fairly simple - the user selects filters from dropdown menus and then clicks a button to add key-value pairs of filters to the URL route. There a ...

angularangular-router

Global Enum in Typescript that is Optimized for Inlining during Compilation

I'm facing a challenge with an enum that is widely used in my project. Having to import it into every file is becoming cumbersome. Is there a way to define the enum in the .d.ts file so that it automatically gets included when compiled to Javascript? ...

typescriptenums

Is there a way to receive messages from background.js of a Chrome Extension within an Angular web application?

I've developed a Chrome Extension that sends messages to all tabs (through background.js) using the following code: chrome.tabs.query({}).then((tabs)=> { if (tabs) { tabs.forEach(tab => { chrome.tabs.sendM ...

angulargoogle-chrome-extension

Struggling to modify a string within my React component when the state is updated

Having a string representing my file name passed to the react-csv CSVLink<> component, I initially define it as "my-data.csv". When trying to update it with data from an axios request, I realize I may not fully understand how these react components w ...

htmlreactjstypescriptaxioscomponents

Error encountered when unsubscribing from Angular datatable while closing ngx-bootstrap modal

I am currently facing an issue with Angular DataTable and ngx-bootstrap modal. After closing the modal, the datatable throws an unsubscription error and fails to initialize properly. I have tried various solutions such as re-rendering and unsubscribing o ...

angulardatatablemodal-dialogangular7ngx-bootstrap

Exploring Cypress: Leveraging the Power of Variable Assignment

Recently, I encountered an issue while working with a variable in a Cypress each loop. Despite incrementing the variable within the loop, it resets to zero once outside of it. Can someone shed light on why this happens and suggest a solution? Thank you. p ...

javascripttypescriptcypress

What are the steps to generate an npm package along with definition files?

Is it possible to create an NPM package with definition files containing only interfaces declared in *.ts files? Consider a scenario where we have two interfaces and one class definition: export interface A { id: number; } export interface B { name: s ...

javascriptnode.jstypescriptnpm

Is there a way to automatically incorporate a component into every view within a Next.js application?

Is there a more efficient and less cumbersome way to import components for every view in a Next.js app? I am interested in incorporating the "arwes" framework into my project and utilizing components from . One of the examples of a component I will be usin ...

reactjstypescriptnext.jsjsxstyled-components

Learn how to use Angular 5 to retrieve data from an API

I'm currently working on a data service that fetches data from my API: import { Injectable } from '@angular/core'; import { BehaviorSubject } from 'rxjs/BehaviorSubject'; import { HttpClient, HttpParams } from '@angular/commo ...

phpangular

An Array of objects is considered NULL if it does not contain any values before being iterated through

Working with Files in TypeScript (Angular 8) has led me to Encode the files in Base64 using the code below: private async convertToBase64(evidences: Array<EvidenceToDisplay>): Promise<Array<EvidenceToDownload>> { const results: Arr ...

javascriptangulartypescript