Node uses 150% of CPU on sass compile - node.js

I found lots of issues with offered solutions on node using cpu but no one solved my problem - mostly it was said to install fsevents and rebuild, remove node modules and reinstall. Also was offered to add poll:false, but I'm not sure I have web-pack. I'm practicing sass so it's a very simple app having only sass installed as a node module, and the script is:
"scripts": {
"compile:sass": "node-sass sass/main.scss css/style.css -w"
}
So all I use is live-server and npm run compile:sass.
Versions:
node-sass: "^4.14.1",
Node: "^14.15.0"
I tried to see what's going on with node cpu consumption when running other apps that do not include that script, and the consumption was adequate.
Besides all of that I tried to change versions of node-sass (to 4.13.1) and nodejs (to 14.15.4) and also I deleted the node-sass globally.
Does anyone know what can be the solution?

The problem was in live-server - not in nodejs or node-sass as I thought.
If I understand right, live-server watched node_modules folder which had node-sass watching as well, and that caused such CPU load.
Once node_modules will be ignored by live-server, the problem is solved.

Related

Why are node modules so large?

I am new to Node. I just tried installing nodemon and that resulted in a huge node modules folder with more than 100 folders. Is nodemon actually that big or am I doing something wrong. I used the following commmand:
npm i nodemon -D
Because nodemon is built with other npm packages. You can see the dependencies in its official page:
https://www.npmjs.com/package/nodemon
And in turn the dependencies may depend on other modules. That's why node_modules can have many files. But don't worry, this is normal.

Cannot find module 'fs/promises' Electron JS

Good morning,
I have created a program in Vue JS, this connects with an API that I have created in a main.js file to execute system commands.
The problem I have is that when compiling for production with electron I get the following error:
I use the command npm run electron: build
When I use npm run electron:serve work without problems
Anyone have any idea why is the error and how to fix it?
Thanks
I experienced this issue a few days ago as well. I realized that trying to fix another issue, I deleted the node_modules folder and the package-lock.json file, then run the npm install command. This made the build to fail with 'fs/promises'. There are 2 solutions to this issue:
Download the latest stable Node version. This should have the 'fs/promises' module and will fix the issue.
Delete the node_modules folder and bring back the old package-lock.json file to ensure that the package versions remain the same. Then run the npm install command and the issue should be fixed.
downgrade electron
"electron-builder": "^22.10.5",
or upgrade nodejs to 14+ v
downgrade to "electron-builder": "~22.10.5" is working for me
In that case I fixed the problem in that way:
const fs = require('fs').promises;
Instead of:
const fs = require('fs/promises');
In my case I was using nvm to manage multiple node versions.
During the npm package installation, and throughout development, I used Node v14 but for some reason, my terminal was pointing to Node v12 when I tried bundling my program afterwards.
Switching it back to Node v14 using nvm use 14 solved my issue.
So make sure you're using the correct node version.
Upgrade to electron-updater#5.0.0. It has patch changes replacing fs/promises with fs-extra to support legacy versions of electron.
got the same error "Cannot find module 'fs/promises'" while I don't use electron.
so the problem is not only related to electron
solved the problem just by upgrading nodejs from v13.9.0 to v14.19.3
If this happens to you (and I'm not using Electron either), and you have to stay on Node 12 like me (because the code you are maintaining is ancient), pray that you can get to one of the npm-shrinkwrap.json files you used that worked, then go through package.json, force every version to what was in the shrinkwrap file, rm -rf node_modules, and npm install.
I experienced this issue a few days ago. I realized that trying to fix another issue, I deleted the node_modules folder and the package-lock.json file, then run the
npm install
This made the build to fail with 'fs/promises'.
Delete the node_modules folder and bring back the old package-lock.json file to ensure that the package versions remain the same
then run the npm command with force
npm install --force
it work for me..
I had the same problem, after upgrading the electron-builder from v. 21.4.0 to 23.0.2, updated with the command:
 
sudo npm install -g electron-builder#23.0.2
I solved updating npm, and then node.js.
Update npm:
sudo npm install -g npm#latest
 
Install nodejs from https://nodejs.org
Now it works with :
 
Electron-builder: 23.0.2 (command electron-builder --version)
Npm: 8.7.0 (command npm --version)
Nodejs: v16.15.0 (command node --version)

react-scripts required old version of webpack

I installed webpack into my react project, but the same error occurred every time when I use npm start:
The react-scripts package provided by Create React App requires a dependency:
"webpack": "4.42.0"
Don't try to install it manually: your package manager does it automatically.
However, a different version of webpack was detected higher up in the tree:
C:\react\minimoj\node_modules\webpack (version: 4.43.0)
I tried to remove package-loc.json file + all node_modules + remove webpack name from package.json and reinstall it with npm install. Also I tried same with yarn, but it didn't help. I see that in node_modules version is 4.43 and after I use npm install webpack in the file package-loc.json it shows 4.43, but at the moment when I use npm start it changed to 4.42 and error occur. In addition I also reinstall node.js but it didn't help.
create .env file and add SKIP_PREFLIGHT_CHECK=true
I had similar with a newer webpack version being installed than what react_scripts required.
To fix I deleted webpack and webpack-dev-server from my project's node_modules, went to a console outside of the project dir and ran
npm uninstall webpack
npm uninstall webpack-dev-server
Then ran
npm install
npm run build
And all was well, as my package.json was correct without change.
Since webpack is mostly focused on common js according to some websites, I just tried rollup for my react project and it proved to be much more effective as it supports es+. I would highly recommend it. I took a couple minutes to have everything setup and ready. Also, as a good practice it is better to use yarn as npm has had a lot of known issues for node app management.

Angular CLI - ng serve - high cpu usage from node process

I am struggling with an issue where on running any angular app locally the node process linked to ng serve is using well over 100% of my CPU core's.
My current environment is:
Angular CLI: 7.3.10
Node: 11.15.0
OS: darwin x64 (Mac OS X Catalina 10.15.4)
Angular: 7.2.16
I have come across numerous posts and issues about this where the common solutions appear to be to install fsevents for Mac OS issues.
Things I have tried:
Installing XCode Command Line Tools for node-gyp to rebuild fsevents after its installed
Install the latest version of fsevents (2.1.3) as an older version is specified as an optional dependency with angular-cli (1.2.13)
Using a different node version, tried 12.13.0 and deleting node_modules and doing a clean install. Also tried latest fevents version again
Incase its relevant I use nvm also
Tried npm rebuild
Upgrading one of my apps from Angular 7 to 9, still same behaviour after clean install of dependencies, ensuring fsevents is installed and trying latest version too
No matter what I try, I keep observing high cpu usage, I have seen it creep up too 300-400% at times.
This is really hampering my development and I am hoping someone may have some bright ideas I could try out.
Failing that, I am wondering if I should try uninstalling node completely, getting rid of nvm and starting from scratch.
In Angular development context; transpilation/compilation causes CPU spike. When this happens too frequent, your system is in trouble.
There are certain ways to relieve the pain a little;
Turn off file change detection / live-reload / auto compilation entirely
ng serve --live-reload false or ng serve --no-live-reload etc. depending on your Angular CLI version
Have a better change detection, react only when really needed
npm install fsevents
npm rebuild fsevents
npm serve
Forget change detection, check changes based on a time interval
ng serve --poll [ms]
CPU management is tricky, there can be many reasons for this problem. These are only a few possibilities closely related to Angular development. I hope this answer provides some options to try to the ones having the same trouble.
Maybe you have similar setup for you hot/live reloading on Docker such as ng serve --host 0.0.0.0 --poll 1. The poll value is problematic, change it on something larger, for example 2000, such that ng serve --host 0.0.0.0 --poll 2000.
Now, you'll loose (almost) real-time hot/live reloading, but you'll save your CPU/battery and having 2 seconds delay before your app will refresh the changed code.
it seems i managed to resolve the problem:
delete the /node_module and install again
in my case that helped
i found the advise here:
https://gitmemory.com/issue/angular/angular-cli/14748/501608887
If you use Yarn to install packages, its lockfile may have locked in an older version of fsevents which has known issues with node-pre-gyp on Apple Silicon.
https://github.com/nodejs/node-gyp/issues/2296
Simply deleting yarn.lock, and running yarn again, should attempt to install newer versions of the fsevents dependency, which does not have that issue.
This worked with Angular 11.
Setting the flag --watch=false is what reduced CPU usage of my angular process from 50% to 0%:
ng serve --configuration=dev --watch=false

How to fix "ReferenceError: primordials is not defined" in Node.js

I have installed Node.js modules by 'npm install', and then I tried to do gulp sass-watch in a command prompt. After that, I got the below response.
[18:18:32] Requiring external module babel-register
fs.js:27
const { Math, Object, Reflect } = primordials;
^
ReferenceError: primordials is not defined
I have tried this before gulp sass-watch:
npm -g install gulp-cli
I hit the same error. I suspect you're using Node.js 12 and Gulp.js 3. That combination does not work: Gulp.js 3 is broken on Node.js 12 #2324
A previous workaround from Jan. does not work either: After update to Node.js 11.0.0 running Gulp.js exits with 'ReferenceError: internalBinding is not defined' #2246
Solution: Either upgrade to Gulp.js 4 or downgrade to an earlier version of Node.js.
We encountered the same issue when updating a legacy project depending on gulp#3.9.1 to Node.js 12+.
These fixes enable you to use Node.js 12+ with gulp#3.9.1 by overriding graceful-fs to version ^4.2.10.
If you are using pnpm
pnpm supports overriding some dependencies versions. To do it, you should add a pnpm section in your package.json file:
{
"pnpm": {
"overrides": {
"graceful-fs": "^4.2.10"
}
}
}
If you are using yarn v1
Yarn v1 supports resolving a package to a defined version.
You need to add a resolutions section to your package.json:
{
"resolutions": {
"graceful-fs": "^4.2.10"
}
}
Thanks #jazd for this way to solve the issue.
If you are using npm
Run this command to know which version of Node.js you are using:
node -v
It will return a version number <major>.<minor>.<patch> such as 18.11.0.
If your version is v16.14.0 or above, then you can override the version of graceful-fs by adding an overrides section in your package.json file:
{
"overrides": {
"graceful-fs": "^4.2.10"
}
}
Otherwise, you need to use npm-force-resolutions as a preinstall script to be able to override the version of graceful-fs by changing your package.json file like this:
{
"scripts": {
"preinstall": "npx npm-force-resolutions"
},
"resolutions": {
"graceful-fs": "^4.2.10"
}
}
npm-force-resolutions will alter the package-lock.json file to set graceful-fsto the wanted version before the install is done.
If you are using a custom .npmrc file in your project and it contains either a proxy or custom registry, you might need to change npx npm-force-resolutions to npx --userconfig .npmrc npm-force-resolutions because some versions of npx don't use the current folder .npmrc file by default.
Origin of the problem
This issue stems from the fact that gulp#3.9.1 depends on graceful-fs#^3.0.0 which monkeypatches Node.js fs module.
This used to work with Node.js until version 11.15 (which is a version from a development branch and shouldn't be used in production).
graceful-fs#^4.0.0 does not monkeypatch Node.js fs module anymore, which makes it compatible with Node.js > 11.15 (tested and working with versions 12, 14 and 16).
Note that this is not a perennial solution but it helps when you don't have the time to update to gulp#^4.0.0.
Fix it in one minute:
Just follow these steps. I'm on Windows 10 and it worked perfectly for me!
In the same directory where you have package.json create a npm-shrinkwrap.json file with the following contents:
{
"dependencies": {
"graceful-fs": {
"version": "4.2.2"
}
}
}
Run npm install, and don't worry, it will update npm-shrinkwrap.json with a bunch of content.
Run gulp to start the project.
Use the following commands and install Node.js v11.15.0:
npm install -g n
sudo n 11.15.0
will solve
ReferenceError: primordials is not defined in node
Referred from #Terje Norderhaug #Tom Corelis answers.
Use the following commands to install Node.js v11.15.0 and Gulp.js v3.9.1:
npm install -g n
sudo n 11.15.0
npm install gulp#^3.9.1
npm install
npm rebuild node-sass
It will solve this issue:
ReferenceError: primordials is not defined in node
For me, Diego Fortes' answer works with one small change.
Here is my workflow if this error appears:
npm install
npm install gulp
create file npm-shrinkwrap.json with
{
"dependencies": {
"graceful-fs": {
"version": "4.2.2"
}
}
}
npm install (again) (Not npm install gulp again! Very important - otherwise the error will be come back)
gulp (now working)
Using NVM to manage what Node.js version you're using, running the following commands worked for me:
cd /to/your/project/
nvm install lts/dubnium
nvm use lts/dubnium
yarn upgrade # or `npm install`
Simple and elegant solution
Just follow these steps. It worked perfectly with npm install running multiple times or installing any other modules or even publishing project to artifactory.
In the same directory where you have package.json create a npm-shrinkwrap.json file with the following contents:
{
"dependencies": {
"graceful-fs": {
"version": "4.2.2"
}
}
}
Run npm install, and don't worry, it'll update npm-shrinkwrap.json with a bunch of content. Let's get rid of this updates by updating package.json scripts options.
"scripts": {
"preshrinkwrap": "git checkout -- npm-shrinkwrap.json",
"postshrinkwrap": "git checkout -- npm-shrinkwrap.json"
}
Now you can run npm install and your npm-shrinkwrap.json will be intact and will work forever.
Gulp 3.9.1 doesn't work with Node v12.x.x, and if you upgrade to Gulp 4.0.2, you have to completely change gulpfile.js with the new syntax (series & parallels). So your best bet is to downgrade to Node.js v 11.x.x (the 11.15.0 version worked fine for me) by simply using the following code in a terminal:
nvm install 11.15.0
nvm use 11.15.0 # Just in case it didn't automatically select the 11.15.0 as the main node.
nvm uninstall 13.1.0
npm rebuild node-sass
TL:DR
Gulp 3.* doesn't work on Node.js 12.* or above. You have to downgrade Node.js, or upgrade Gulp.
If you are short on time, downgrade Node.js to v11.* or below; if you need newer features, and have time to possibly fix a load of broken dependencies, upgrade Gulp to 4.* or above!
As others have already mentioned, Gulp 3.* is not supported on Node.js 12 or above, so you will have to downgrade your Node version to 11.* or below, OR upgrade your Gulp to 4.0.
The best option depends ultimately on how much time you have, as upgrading Gulp brings benefits of cleaner gulpfiles and in-built control over having tasks run in series or parallel, but also relies on you rewriting your gulpfile to a new syntax, and might (read: probably will - see end of this comment) cause conflicts with some dependencies.
Downgrading Node.js
This is the easiest and quickest option. Especially if you use n or nvm, as these allow you to very quick install and switch between Node.js versions.
Installing Node.js version on N
n 10.16.0
Installing a Node.js version on NVM
nvm install 10.16.0
Once you have done this, you may need to rebuild your npm dependencies or alternatively remove both your node_modules folder and your package-lock.json file and reinstalling your dependencies. Though if you are merely reverting to a preexisting Node.js version, you should probably be fine.
Upgrading Gulp
As mentioned above, this is a more time-intensive task, but it might bring benefits in the long run. For example, Node.js 12 has now introduced native support for ES Modules (behind an experimental flag) and full support in Node.js 13.
You may need to upgrade Node.js to use that, forcing you to upgrade Gulp. Or you may simply want the benefits of using Gulp 4, as it offers better and more efficient control over writing tasks.
There are a number of articles on this already, so I won't elaborate any further on the specifics, but to reiterate - this is not a quick job. Depending on the size of your project, there may be some notable rewriting required, and you may have dependencies that break. If you are in short supply of time, you should opt for simply downgrading Node.js, at least temporarily.
But I already have Gulp 4, and it still doesn't work!
If, like me, you are already using Gulp 4+ (I was using Gulp 4.0.2, originally on Node.js 10) and have recently upgraded (I upgraded to Node.js 13.8.0) are you are still getting the issue, it may be because a dependency is relying on an older version of Gulp, and that is getting caught in the pipeline.
In my case, gulp-combine-mq was a dependency using Gulp 3.9.*. Disabling this task in my gulpfile allowed Gulp to run again.
If this happens, you have a few options. You can,
Go without the plugin if it's not absolutely necessary
Find an alternative,
Fix the plugin
Needless to say, if you have several plugins that rely on an older version of Gulp - especially if these plugins are vital for your application - this is where there can be a huge additional chunk of time spent in upgrading Gulp (hence the warnings above).
If this happens, it is best to just downgrade Node.js, at least until patches can be issued.
I had the same error. I finally fixed that when I updated all packages and then mentioned the same Node.js engine version and npm version in package.json as it is in my local working system.
"engines": {
"node": "10.15.3",
"npm": "6.9.0"
}
I was getting this error when deploying on Heroku.
For more, check out Heroku support.
Check Node.js version:
node --version
Check gulp version:
gulp -v
If Node.js >=12 and gulp <= 3, do one of the following:
Upgrade gulp
sudo npm install -g gulp
Downgrade node
sudo npm install -g n
sudo n 11.15.0
How to Upgrade (or Downgrade) Node.js Using npm
In case the problem is not from gulp then check the unzip npm module. It's been around six years since the last time it was updated. It doesn't work with Node.js > v11.
Try this:
npm install -g n
sudo n 11.15.0
The problem occurred for me in Visual Studio's Task Runner Explorer only and not when running from the command line or PowerShell.
I realised that VS was ignoring the Node version I had set with NVM.
This post gave the answer: Configure which NPM is used by Visual Studio's Task Runner Explorer? by setting the PATH variable as a higher priority than external tools in VS, it used the Node version set by NVM and not the version installed with VS.
This error is because of the new version of Node.js (12) and an old version of Gulp (less than 4).
Downgrading Node.js and other dependencies isn't recommended. I solved this by updating package.json file, fetching the latest version of all dependencies. For this, I use npm-check-updates. It is a module that updates the package.json with the latest version of all dependencies.
Reference: https://www.npmjs.com/package/npm-check-updates
npm i -g npm-check-updates
ncu -u
npm install
In most cases, we will have to update the gulpfile.js as well like the following:
Reference: Gulp 4: The new task execution system - gulp.parallel and gulp.series, Migration
Before:
gulp.task(
'sass', function () {
return gulp.src([sourcePath + '/sass/**/*.scss', "!" + sourcePath + "/sass/**/_*.scss"])
....
}
);
Other configuration...
gulp.task(
'watch', function () {
gulp.watch(sourcePath + '/sass/**/*.scss', ['sass']);
}
);
After:
gulp.task('sass', gulp.series(function(done) {
return gulp.src([sourcePath + '/sass/**/*.scss', "!" + sourcePath + "/sass/**/_*.scss"])
...
done();
}));
Other config...
gulp.task(
'watch', function () {
gulp.watch(sourcePath + '/sass/**/*.scss', gulp.series('sass'));
}
);
Downgrading to Node.js stable fixed this issue for me, as it occurred after I upgraded to Node.js 12:
sudo n 10.16.0
I faced the same issue. What I tried and what worked for me:
Check the version of Node.js and Gulp.js (a combination of Node.js v12 and Gulp.js less than v4 doesn't work)
I downgraded the NPM version by:
sudo NPM install -g n
sudo n 10.16.0
It worked fine. Then just follow the instructions of your console.
Upgrade to 4.0.1 and make sure to migrate https://fettblog.eu/gulp-4-parallel-and-series/#migration
I was getting this error on Windows 10. It turned out to be a corrupted roaming profile.
npm ERR! node v12.4.0
npm ERR! npm v3.3.12
npm ERR! primordials is not defined
npm ERR!
npm ERR! If you need help, you may report this error at:
npm ERR! <https://github.com/npm/npm/issues>
npm ERR! Please include the following file with any support request:
Deleting the C:\Users\{user}\AppData\Roaming\npm folder fixed my issue.
If keeping Node.js v12 while using the latest gulp ^4.0, follow these steps:
Update the command-line interface (just for precaution) using:
npm i gulp-cli -g
Add/Update the gulp under dependencies section of your package.json file
"dependencies": {
"gulp": "^4.0.0"
}
Delete your package-lock.json file.
Delete your node_modules folder.
Finally, run npm i to upgrade and recreate a brand new node_modules folder and package-lock.json file with correct parameters for Gulp ^4.0:
npm i
Note Gulp.js 4.0 introduces the series() and parallel() methods to combine tasks instead of the array methods used in Gulp 3, and so you may or may not encounter an error in your old gulpfile.js script.
To learn more about applying these new features, this site have really done justice to it: How to Migrate to Gulp.js 4.0
I fixed this issue on Windows 10 by uninstalling Node.js from Add or Remove Programs → Node.js.
Then I installed version 11.15.0 from https://nodejs.org/download/release/v11.15.0/
Choose node-v11.15.0-x64.msi if you're running Windows 64-bit.
If you're trying to install semantic-ui and the following error occurs then try downloading the latest version of Node.js js(13.5.0) with the latest features, from Node.js.org.
Moreover, rather than trying the NPM install semantic, you should just add the link (which you can find from the cdnjs link) to the header of your index.html file.
Gulp is making issue with Node.js version 11 and above. Uninstall your current Node.js version and reinstall the v10.15.1 version. Here is the link for that version. This helps me and it will solve your problem too.
https://nodejs.org/download/release/v10.15.1/
Install gulp and add your Node.js version to the package.json file like so:
{
"dependencies": {
"node": "^10.16.3"
}
}
I have tried a lot of suggestions to fix this problem for an existing project on my Windows 10 machine and ended up following these steps to fix it;
Uninstall Node.js from "Add or remove programs". Fire up a new Command prompt and type gulp -v and then node -v to check that it has been uninstalled completely.
Download and install Node.js v10.16.0 - not the latest as latest node & gulp combination is causing the problem as far as I see. During installation I didn't change the installation path which I normally do(C:\Program Files\nodejs).
Open up a new Command prompt, go to your project's directory where you have got your gulpfile.js and start gulp as shown in the image.
Please note sometimes when I switch between git branches I might need to close my Visual Studio and run it as Admin again in order to see this solution working again.
As far as I see this problem started to happen after I installed the latest recommended version(12.18.4) of Node.js for a new project and I only realised this when some FE changes weren't reflected on the existing web project.
Update: Today I had the same problem while setting up one of my existing projects on my new PC and I did the same steps + went to the directory where I have the gulpfile and then run npm install.
It seems you've upgraded your nodejs's version to be +12 and still using gulp 3.9.1
You can use one of the below solutions
Upgrade you glup version to be +4
Or simply you use NVM Node version Manager
To run multiple nodejs versions on the same machine.
I had this very same error, but it was caused by a different issue.
OS: windows 10
nodejs version: 15.12.0
npm version: 7.6.3
The cause of the problem was graceful-fs package.
Whenever I tried to run npm, even running npm-v was firing "ReferenceError: primordials is not defined".
I tried running npm install graceful-fs#latest, but it still didn't work, even though the package was latest version.
So what helped me?
run npm ls graceful-fs
This way you'll find all packages on which graceful-fs is dependency and which version it has. In my case it was mostly version 3.0, even though I've installed version 4.2.6
So how to fix it?
Open npm-shrinkwrap.json (not sure about packages-lock.json) and change search for graceful-fs - you'll see that it has older versions on a few places. Replace it with ^4.2.6 (or newer).
Then npm audit fix --force which will forcefully install the newer version everywhere.
Hope this works for you, it took me a few hours to find out how to fix it.
Since my project was using gulp version 4, I had to do the following to solve this
Delete folder node_modules
open package.json and update version
Here is the detail of version I am using
Now run npm install and then run gulp default. The error should be gone and you may see:
Task never defined: default only.
Remove package-lock.json or yarn.lock file.
Then remove node_modules.
After that modify the package.json file-
"dependencies": {
"gulp": "^4.0.0"
}
Then run- npm install
It will be enough to solve this problem.
This is because the compatibility issue between node and gulp in your system. Downgrading the node or upgrading the gulp will fix this issue.
sudo npm i -g n
sudo n 11.15.0
Try removing the node_modules folder and package-lock.json file and installing again using npm i command if still not working.

Resources