Angular 9 ng new stuck at installing packages - javascript

I have just installed the node version 12.16.1 the LTS and
angular cli version 9.0.3.
At the time of creating new project with cli all files in root folder are generating but it is stuck at the part of installing node packages.
Is anybody facing the same issue? Please help how can we resolve it.

Run command npm i -g npm#latest
Run command npm i -g #angular/cli#latest
It worked for me.

Every time you create a new project the angular suppose to download huge chunks of file of size around 500mb, all the time that is been taken is actually the time taken to download those file in the background. A good internet connection is the solution.

I changed directory and then run these command and it worked for me
sudo npm cache clean --force
sudo npm cache verify
sudo npm i npm#latest -g
ng new my-project
Another Solution:
Cancel the installing packages with ctrl+c
and then go to the files of project and run command npm install
This also worked for me

I faced the same issue quite a few times.
Try using: ng new project_name --skip-install
And then, go to the file and do npm install

I had exactly the same problem.
I tried everything. Reinstallation of node several times. Latest version didn't change anything. Stuck at Installing packages (npm)...
I was running node.js within a virtual machine. Only 1 gig of memory was allocated to the VM. Allocating more memory (from 1 gig to 4 gig) solved the problem. if there is not enough memory, node.js does not complain but seems stuck.
I can reproduce the problem. Now with 4 gig instead of 1 gig, ng new app took only 30 seconds.

You can set up one workspace (one folder) for all your applications, by running
ng new your_workspace --create-application false
and then create your new apps inside this workspace
cd your_workspace
ng generate application testApp
Maybe it helps to your needs

Related

Node cannot find path in node_modules / 'react-scripts' is not recognized as an internal or external command

I'm on windows 10
When I run:
npm run start
or
npm start
I get an error:
npm start
> app-test#0.1.0 start
> react-scripts start
'react-scripts' is not recognized as an internal or external command,
operable program or batch file.
What I already tried:
npm ci
remove node_modules and reinstall project
npm audit fix
run command from elevated PowerShell (as admin)
Uninstall Node v.18 win NVM and reinstall common Node installation LTS v.16
Check if react scripts is on dependencies section in package.json - and it's of course there.
Recreate project itself and also create a fresh new React project with npx create-react-app
Clearing npm cache
Nothing's helped me.
BUT This project runs fine WHEN I explicitly tell the node path to subfolder with a script:
app-test> node node_modules/react-scripts/scripts/start.js
Compiled successfully!
You can now view app-test in the browser.
Local: http://localhost:3000
On Your Network: http://192.168.91.1:3000
Note that the development build is not optimized.
To create a production build, use npm run build.
webpack compiled successfully
What's interesting that an old React projects also resided in the parent folder starts normally even I renew node_modules in these projects doing them npm i or npm ci
But any time I try to create and start new React app command npm start fails
UPD1: Tried to create-react-app on any other drive or folder. And it's running ok.
So culprit seems permissions policies in my common working directory ?
UPD2:
I resolved a problem though still have no clear idea who was actually the really culprit of this bug.
I copied all my parent developer folder with all code examples to another drive, then tried to create react app there and out of the blue it worked fine at then new location.
Also I removed this original folder from the drive where it used to be. And do git clone "..." at this directory< recreating the exact structure as it was before all experiments.
Then I tried create-react-app exactly at that location as I've unsuccessfully tried before swapping folders and it was OK !
Tried couple of time with different folder location within parent directory and all sill working fine now !
I remembered now I already have such bug before. And I had to reinstall Windows that time.
I also want to mention that I also have another machine with Windows, another one with Linux and had also laptop with an OSX so I can ( or could) push to this very git repository from any of these computers.
Suggestion of somebody who have any idea, why this bug was happening repeatable would be highly appreciated.
Thanks.

NPM peer dependencies issue while building vis-timeline locally

I am using vis-timelime in one of my projects. I have done some changes in vis-timeline, then locally build it and using it as dependency in my project. While doing so, vis-timeline is getting installed properly but i believe the peer dependencies of vis-timeline are not coming. Do note that I'm using npm version - 7.6.3.
cd vis-timeline;
//added some console logs in few files
npm install;
npm run build;
Then in my project-
cd my-app
npm install local-path-to-my-vis-timeline
Running above commands install the vis-timeline in node_modules of my-app. However, other peer dependencies of vis-timeline like vis-data, etc. do not come automatically. Since I am using npm version 7.6.3, wasn't it supposed to happen automatically?? If not, any graceful solution to this?
Or let me know of any other better way to locally do changes in vis-timeline library and use it in my local project for debugging.
Sounds like an issue with npm. This post has a list of solutions that might work.
Otherwise, maybe try using yarn instead of npm?

NPM Install giving rollbackFailedOptional

After trying to use the Windows Powershell (as an admin), the command prompt (as an admin) and the bash CMD; I repeatedly get the following error after trying an npm install command:
npm install npm#latest -g
is the attempted command and...
[...] / rollbackFailedOptional: verb npm-session xxxxxxxxxxx
where the 'x's represent different letter and number combinations at each attempt, is the message. I am aware that this should be the first step in the installation of a package but it remains on this message for a long time and will not change.
I am trying to use the JavaScript React library, more specifically the 'create-react-app'. The npm install -g create-react-app command is also causing the error.
npm version: 6.5.0
npx version: 10.2.0
node version: 10.15.0
A solution would be greatly appreciated.
https://docs.npmjs.com/try-the-latest-stable-version-of-npm In this link there is the documentation for updating npm version for windows with a link to a tool developed by Microsoft to update npm (https://github.com/felixrieseberg/npm-windows-upgrade)
I found the solution:
As my device username has both my first and last names, with a space in between, npm was reaching errors because of this. So the solution was to uninstall node from the default location and reinstall it in a folder on my C:\ drive, where there were no files in the directory that have spaces in the names. I then changed the cache location into this same C:\ drive folder, and the problem was solved.
npm config set cache C:\NODEJS\npm-cache
(these folders must be created before you can set the config directory to these.)
For me, I ended up having to:
Uninstall Node.js
Remove the folder "nodejs" completely from C:\Program Files (or
wherever you decided to install node)
Reinstall Node.js
After that, I did not encounter [...] / rollbackFailedOptional: verb npm-session xxxxxxxxxxx anymore.
I'm not quite sure what the issue was but all suggestions I found on stack did not solve this problem for me. I hope this helps someone.
Check if you are connected to any other VPN or proxy setting. If so try to disable it or disconnect from it and then execute the npm command. It worked for me. In my case, I was using the organization laptop and was connected to external vpn network, so i disabled the vpn and tried the command and it worked.
In our case the hard disc of the nexus server (repository server) was just full. Maybe someone helps this. Before looking into other more complicated options.
for my case i uninstalled the reinstelled it and used powershell insted of cmd and it worked like a charm
First run these commands.
npm config rm proxy
npm config rm https-proxy
then run this.
npm config set registry https://registry.npmjs.org/
check if the internet is connected
and try to run the npm command which was giving the error.

Building new release of ngx-charts

I'm attempting to add a personally desired feature for ngx-charts. I got it to work using the standard src directory but, I wanted to build a release version potentially.
Here are the steps to reproduce the issue:
npm i https://github.com/swimlane/ngx-charts/tarball/master --save (this grabs the entire project instead of just the release)
Go into your node_modules/#swimlane/ngx-charts folder and delete the release directory
Rebuild the directory by running npm i && npm run package
Notice how index.d.ts is unable to find any modules even though they're there.
I have noticed that the /common/base-chart.component.d.ts file is never created for some reason causing this problem. But, I cannot for the life of my figure out why. I've tried multiple webpack versions 2-4 but, every attempt results in the same thing.
I believe I am doing something wrong which is why I did not open an issue. I would appreciate any insight into this problem. Thank you for reading!
I would recommend cloning the repository locally rather than installing it from npm:
git clone git#github.com:swimlane/ngx-charts.git
Then install dependencies:
cd ngx-charts
npm install
After that make your changes to the src (you can run the demo app to test while developing with "npm run start")
Then to package:
npm run package
This will build the project and update the release folder

FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory in Ionic 3

When I run an Ionic 3 project using the ionic serve command, then I am getting this error:
For a non-Angular general answer for those who land on this question from Google:
Most times when you face this error it’s probably because of a memory leak, an addition/version upgrade of a library or a difference in how Node.js manages memory between versions (e.g. Node.js version <= 10 and Node.js version > 10).
Usually just increasing the memory allocated to Node.js will allow your program to run but may not actually solve the real problem and the memory used by the node process could still exceed the new memory you allocate. I'd advise profiling memory usage in your Node.js process when it starts running or updating to Node.js > 10.
I had a memory leak.
Here is a great article on debugging memory leaks in Node.js.
That said, to increase the memory, in the terminal where you run your Node.js process:
export NODE_OPTIONS="--max-old-space-size=8192"
where values of max-old-space-size can be: [2048, 4096, 8192, 16384] etc
More examples for further clarity:
export NODE_OPTIONS="--max-old-space-size=5120" # Increase to 5 GB
export NODE_OPTIONS="--max-old-space-size=6144" # Increase to 6 GB
export NODE_OPTIONS="--max-old-space-size=7168" # Increase to 7 GB
export NODE_OPTIONS="--max-old-space-size=8192" # Increase to 8 GB
# and so on...
# formula:
export NODE_OPTIONS="--max-old-space-size=(X * 1024)" # Increase to X GB
# Note: it doesn't have to be multiples of 1024.
# max-old-space-size can be any number of memory megabytes (MB) you have available.
See the current value of max-old-space-size (in MB)
To see the current (not exact but very close) value of max-old-space-size (in MB), run in your terminal
node -e 'console.log(v8.getHeapStatistics().heap_size_limit/(1024*1024))'
In my case, I fixed this problem by installing Node.js, version 12.10.0.
I had the same issue on CentOS server 7, but this solved my problem:
node --max-old-space-size=X node_modules/#angular/cli/bin/ng build --prod
Where X = (2048 or 4096 or 8192 o..) is the value of memory.
Just type this in the terminal:
export NODE_OPTIONS="--max-old-space-size=8192"
The error occurs when you exceed the default maximum memory allowed for Node.js. All this does is increase the maximum memory allowed.
I got the same error when I execute ng build command in Visual Studio Code. But I can build successfully when I execute the same thing on the Windows command line in the following sequence.
Step 1.
set NODE_OPTIONS=--max_old_space_size=4096
Step 2.
ng build
Try this solution which was pointed out in an old message on the forum: 3.7.0: iOS build with --prod not working
Open node_modules/#ionic/app-scripts/bin/ionic-app-scripts.js
Change the first line from:
#!/usr/bin/env node
to
#!/usr/bin/env node --max-old-space-size=4096
Try values 1024 and 2048, but for a relatively large app you may need 4096.
Windows
From the control panel go to System → Advanced system settings → Environment Variables → New (user or system)
Or this can be done in PowerShell with:
$env:NODE_OPTIONS="--max-old-space-size=8192"
You can also increase this number, if necessary. We've seen folks need to increase this up to 14 GB for some larger projects!
Linux/macOS
export NODE_OPTIONS=--max-old-space-size=8192
In my case it was a recursion that was causing React to use up all memory.
This happened when I was refactoring my code and didn't notice this.
const SumComponent = () => {
return (
<>
<SumComponent />
</>
)
}
In other Node.js applications this might look like:
const someFunction = () => {
...
someFunction();
...
}
I got the same error message when I executed the following statements in Visual Studio Code. But I can build successfully when I execute the same thing in on the Windows command line.
npm install -g increase-memory-limit
increase-memory-limit
set NODE_OPTIONS=--max_old_space_size=4096
ng build -c deploy --build-optimizer --aot --prod --sourceMap
Updating from Node.js 12 to Node.js 14 solved the problem for me.
Update Now Node.js 16 is available, and I recommend updating to the latest available version of Node.js.
For some reasons all the previous answers didn't really work for me. I did the following to fix my issue:
I had to first delete the node_modules folder
reinstall Node.js on my PC and
then npm install
Adding parameter --build-optimizer resolved the issue in my case:
node --max_old_space_size=4096 ./node_modules/#angular/cli/bin/ng build --prod --build-optimizer
I am not sure why adding only --build-optimizer solves the issue, but as per the Angular documentation it should be used with ahead-of-time (AOT) compilation enabled, so the updated command should be like below:
--build-optimizer=true --aot=true
Angular build documentation
export NODE_OPTIONS="--max-old-space-size=6144" #it will increase to 6gb.
-------If Not Solved try this 2nd step-------------
2) Just update your node version to the latest one will solve this issue.
-------If Not Solved try this 3rd step-------------
3)Just run this command in your windows terminal.
set NODE_OPTIONS=--max_old_space_size=4096
node --max_old_space_size=4096 node_modules/#angular/cli/bin/ng build --baseHref=/baseUrl/ --prod=true
For me, I had a syntax error (which didn't show up) and caused this error.
Run this command in your project folder. Use serve instead of build
node --max_old_space_size=8000 node_modules/#angular/cli/bin/ng serve --prod --port=4202
Replace the line
"start": "ng serve -o --port 4300 --configuration=en" with
"start": "node --max_old_space_size=5096 node_modules/#angular/cli/bin/ng serve -o --port 4300 --configuration=en"
NOTE:
port--4300 is not constant depends upon which port you selects.
--max_old_space_size=5096 too not constant; any value 1024,2048,4096 etc
I faced the same problem on Angular. Then I wrote
"serve": "node --max_old_space_size=8192 ./node_modules/#angular/cli/bin/ng serve"
this script to package.json scripts and for me this problem solved.
And run project this command:
npm run serve
Instead of using ng build, I have executed below command in terminal to fix this issue.
node --max_old_space_size=8192 ./node_modules/#angular/cli/bin/ng build --prod
Then do ng serve.
This is how my terminal look like
Windows PowerShell
Copyright (C) Microsoft Corporation. All rights reserved.
Try the new cross-platform PowerShell https://aka.ms/pscore6
PS D:\ProjectPath\Project1> node --max_old_space_size=8192 ./node_modules/#angular/cli/bin/ng build --prod
For me it was a problem with a Firebase package.
Only add "#firebase/database": "0.2.1" for your package.json file. Reinstall node_modules and it works.
For me, the issue was having an extra node_modules folder that I renamed to node_modules_old and running an npm install to generate a fresh node_modules. Somehow the build must have still been picking up the node_modules_old folder, so I moved node_modules_old out of the directory to fix the issue.
I deleted the existing Node.js module and ran the below commands to fix my issue:
npm install -all
npm audit fix
Run this command:
export NODE_OPTIONS="--max-old-space-size=2048"
To check how much you have already:
> node
> v8.getHeapStatistics()
{
total_heap_size: 6049792,
total_heap_size_executable: 524288,
total_physical_size: 5477720,
total_available_size: 1094444024,
used_heap_size: 4141728,
heap_size_limit: 1098907648,
malloced_memory: 8192,
peak_malloced_memory: 582752,
does_zap_garbage: 0,
number_of_native_contexts: 2,
number_of_detached_contexts: 0
}
and then heap_size_limit: 1098907648
Please check your Node.js version:
node -v
If it’s 10.1.1 something, then you need to update your root level Node.js version via the below commands:
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.35.3/install.sh | bash
source ~/.nvm/nvm.sh
nvm ls
nvm install 12.18.1
Once done, please restart your terminal or Visual Studio.
It's working 100$.
For Ionic users, please add the below code in your package.json
"ionic:build": "node --max-old-space-size=16384 ./node_modules/#ionic/app-scripts/bin/ionic-app-scripts.js build",
Another non-Angular answer (I was facing the same issue building a React application on AWS Amplify).
As mentioned by Emmanuel, it seems that it comes from the difference in the way memory is handled by Node.js v10 vs. Node.js v12.
I tried to increase memory with no avail. But using Node.js v12 did it.
Check how you can add nvm use $VERSION_NODE_12 to your build settings as explained by richard
frontend:
phases:
preBuild:
commands:
- nvm use $VERSION_NODE_12
- npm ci
build:
commands:
- nvm use $VERSION_NODE_12
- node -v
- npm run-script build
I guess there are plenty of ways to reach this error!
On my side, I had a loop in my package.json. Project A had a dependency on project B, that had a dependency on project A.
Just run this command:
export NODE_OPTIONS="--max-old-space-size=8192"
If you are developing on Windows and running into this issue while publishing, upgrade Node.js through the official site.
The memory usage handling does increase with each newer version of Node.js, although I did not find exact numbers on what the increase is.
That was the only solution that worked for me. It took a whole weekend and more for me to solve this issue.
I am using the latest stable version of Node.js v-14.17. I was having the same issue with new Angular Ionic projects and tried most of the previous answers without success.
Finally after upgrading to Node.js 16.4.2 LTS, it fixed this issue.
For me I got this error because I lost access to the output path for the dist folder set in my angular.json file. After I reconnected to the remote path with updated credentials the error went away.

Categories

Resources