What is the reason for node-sass being rebuilt after upgrading from npm6 to npm7?

My application utilizes sass opposed to node-sass. Within my package-lock.json file, there is no mention of node-sass.

I have been successfully using npm 6 for years without any issues.

However, upon attempting to run npm install with npm 7, I encounter the following error.

I am puzzled by this situation. Could it be that node-sass is a development dependency of another module and is currently being compiled?

npm ERR! npm ERR! code 1
npm ERR! npm ERR! path /Users/john/.npm/_cacache/tmp/git-clonenbaf30/node_modules/node-sass
npm ERR! npm ERR! command failed
npm ERR! npm ERR! command sh -c node scripts/build.js
npm ERR! npm ERR! Building: /opt/local/bin/node /Users/john/.npm/_cacache/tmp/git-clonenbaf30/node_modules/node-gyp/bin/node-gyp.js rebuild --verbose --libsass_ext= --libsass_cflags= --libsass_ldflags= --libsass_library=
npm ERR! npm ERR!   c++ '-DNODE_GYP_MODULE_NAME=libsass' '-DUSING_UV_SHARED=1' '-DUSING_V8_SHARED=1' '-DV8_DEPRECATION_WARNINGS=1' '-DV8_DEPRECATION_WARNINGS' '-DV8_IMMINENT_DEPRECATION_WARNINGS' '-D_DARWIN_USE_64_BIT_INODE=1' '-D_LARGEFILE_SOURCE' '-D_FILE_OFFSET_BITS=64' '-DLIBSASS_VERSION="3.3.6"' -I/Users/john/.node-gyp/14.18.3/include/node -I/Users/john/.node-gyp/14.18.3/src -I/Users/john/.node-gyp/14.18.3/deps/uv/include -I/Users/john/.node-gyp/14.18.3/deps/v8/include -I../src/libsass/includ...
### above line repeated many times
npm ERR! npm ERR!
javascriptnpmsassnpm-installnode-sass

Answer №1

It's possible that the version of Node or npm you're using is not compatible with the node-sass version that's being pulled. To address this issue, you can refer to node-sass's published compatibility table which outlines the supported versions for different toolchain versions. If one of your dependencies is pulling in node-sass, you have the option to specify your desired version directly as a dependency. Alternatively, you may also consider upgrading your Node or npm versions.

Answer №2

Curious to see the outcome, I decided to experiment with npm install --package-lock-only, and to my surprise, it was successful. This allowed me to view the dependency tree, revealing that node_modules/sass-loader had node-sass as a peer dependency.

I learned that npm7 automatically installs peer dependencies and prevents any ambiguity in the process. (find out more: )

This explained the situation perfectly. Whether it was my lack of thoroughness in reading the stack trace or if there is a standard method for identifying dependencies remains unclear. I'll keep this question open in case someone can suggest a more efficient way to diagnose similar issues.

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

Various input tools available for every Textarea

I'm grappling with this particular case. Each textarea should have its own toolbox, but currently only one is active (I anticipate having more than 2 areas, so JavaScript needs to be able to recognize them by ID) I attempted to use something like: f ...

javascriptjquery

How can I create a more spacious and stylish JTextField for my address bar?

I am working on developing my Java skills by creating a custom browser. Is there a way to adjust the size and shape of the address bar, which is currently implemented as a JTextField with Swing's default settings? Here is the code snippet I am using: ...

javajavascriptcssswingjframe

Incorporate an external JavaScript script using code

I'm currently working on integrating a map widget from 'Awesome Table' into the codebase of an open-source CRM platform. The specific code snippet I need to add is <div data-type="AwesomeTableView" data-viewID="-KLtnY5OHJPgnEOX1bKf"> ...

javascriptjqueryhtmlsrc

Unable to modify the hover color on the image or icon

After creating a circle icon with an image in the center, I wanted to make the image change colors on hover. The main focus of the icon is the circle itself. In my attempt to achieve this effect, I included the following code for the circle icon: .circle- ...

javascriptcss

Router failure resulted in an internal server error

When navigating to a page in my router, I make a REST API request to retrieve data from the server in the beforeEnter clause as shown below: beforeEnter: (to, form, next) => { getData().then( (response) => { ...

javascripttypescriptvue.jstoast

JavaScript preloader failing to wait for images to load

I came across this Javascript code to enable the pre-loader on my website. However, I noticed that it disappears as soon as the page loads, instead of waiting for all images to finish loading. After some research, I found a suggestion to use window.onload ...

javascriptjquery

Node.js Express post query failing to set content type

I have a POST request implemented with the express framework to submit a query to a rest api. Here is the relevant code snippet: var request = require('request'); app.post('/compute', function(req, postResponse) { var queryJSON = re ...

javascriptnode.jspostexpress

Update the router URL without switching pages, yet still record it in the browser history

One of the features on my search page allows users to perform searches and view results. Initially, I faced a challenge in updating the router URL without navigating, but I managed to overcome this by utilizing the "Location" feature. In my ngOnInit meth ...

javascriptangulartypescript

Struggling with replacing text in an array using Javascript (Angular)

I am facing an issue where I need to remove the 'hello' substring from each object field in my objects array. However, I keep getting an error message saying "Cannot read property 'indexOf' of null". This error is occurring because I am ...

javascriptangularjs

Updating the ID's of nested elements in JavaScript when duplicating an element

After a fruitless search on Google, I have turned to the experts on SO for assistance. The challenge: Create a duplicate of a dropdown menu and an input field with the click of a button (which can be done multiple times) The proposed solution: Implement ...

javascripthtml

There seems to be a problem with the bundle.js file caused by Uglify

I've just finished a project and now I'm ready to start building it. Utilizing a boilerplate project, I still find myself struggling to comprehend all the npm/webpack intricacies happening behind the scenes. Whenever I try to run "npm start", I k ...

javascriptnode.jsnpmwebpackuglifyjs

Comparison between TypeScript's variable scope and JavaScript's variable scope

While researching, I discovered some intriguing discrepancies between the documentation regarding a commonly asked question. The TypeScript docs suggest that variables declared with var will escape the containing function's scope, but according to MS ...

javascripttypescriptvarlet

What potential consequences could arise from me removing the node_modules folder?

Every time I try to install a package using npm, I encounter an error. When I run my application with ng serve, it shows an error message saying Error: Type [packageName] does not have 'ɵmod' property. What steps should I take to resolve this is ...

angularnpmnode-modules

The Mat-Timepicker is not visible after building in --prod mode

I have implemented mat-timepicker v5.1.5 successfully on my local environment. However, after building the app for production and deploying it on Tomcat server, the timepicker fails to display. No errors are shown during the build --prod command or in the ...

angularnpmproduction

Retrieving a numerical value from a constantly changing string

The string is constantly changing. For example: Date15:Month8:Year1990 Is there a way to extract the number 15 without using substring, since the values are always different? I am looking to extract only the number after "Date" and before ":". ...

javascriptnode.js

Unable to minimize or hide the ace editor widget with Cypress

Today marks the beginning of my journey into posting on this platform, and I am eager to get it right. In my current project using Cypress for writing integration tests, I encountered a challenge while attempting to click on an Ace editor widget within a ...

javascriptreactjsautomated-testscypressace-editor

Refreshing Angular 9 component elements when data is updated

Currently, I am working with Angular 9 and facing an issue where the data of a menu item does not dynamically change when a user logs in. The problem arises because the menu loads along with the home page initially, causing the changes in data to not be re ...

javascriptangulartypescriptangular-materialangular-changedetection

Is there a way to retrieve the value from a moment-formatted date picker in the (YYYY-MM-DD) format?

I have a Vue application with a datepicker from Ant Design Vue that is returning the following moment object: Moment {…} _d: Thu Oct 24 1996 00:00:00 GMT+0800 (Malaysia Time) _f: "YYYY-MM-DD" _i: "1996-10-15" _isAMomentObject: (...) _isUTC: (...) _isVal ...

javascriptdatevue.jsmomentjsantd

Firefox seems to handle webpages smoothly, whereas IE struggles to display them properly

Check out the code snippet below: self.xmlHttpReq = new XMLHttpRequest(); self.xmlHttpReq.onreadystatechange = function() { if(self.xmlHttpReq.readyState == 4 && self.xmlHttpReq.status == 200) { xmlDoc = self.xmlHttpReq.response ...

javascriptajax

Customize the label of the model in AngularStrap's typeahead ng-options to display something

Utilizing AngularStrap typeahead for address suggestions, I am facing an issue where I want to set the selected address object as my ng-model, but doing so causes me to lose the ability to display just one property of the object as the label. Here is an e ...

javascriptangularjs