Questions tagged [node-sass]

Node-sass is a library that provides binding for Node.js to libsass, the C version of the popular stylesheet preprocessor, Sass.

Node-sass is a library that provides binding for Node.js to libsass, the C version of the popular stylesheet preprocessor, Sass.

It allows you to natively compile .scss files to css at incredible speed and automatically via a connect middleware.

Find it on npm: https://npmjs.org/package/node-sass

Install

npm install node-sass

Usage

var sass = require('node-sass');
sass.render({
    file: scss_filename,
    success: callback
    [, options..]
    });
// OR
var css = sass.renderSync({
    data: scss_content
    [, options..]
});

Options

The API for using node-sass has changed, so that now there is only one variable - an options hash. Some of these options are optional, and in some circumstances some are mandatory. file

file is a String of the path to an scss file for libsass to render. One of this or data options are required, for both render and renderSync. data

data is a String containing the scss to be rendered by libsass. One of this or file options are required, for both render and renderSync. It is recommended that you use the includePaths option in conjunction with this, as otherwise libsass may have trouble finding files imported via the @import directive.

success

success is a Function to be called upon successful rendering of the scss to css. This option is required but only for the render function. If provided to renderSync it will be ignored.

error

error is a Function to be called upon occurrence of an error when rendering the scss to css. This option is optional, and only applies to the render function. If provided to renderSync it will be ignored.

includePaths

includePaths is an Array of path Strings to look for any @imported files. It is recommended that you use this option if you are using the data option and have any @import directives, as otherwise libsass may not find your depended-on files.

imagePath

imagePath is a String that represents the public image path. When using the image-url() function in a stylesheet, this path will be prepended to the path you supply. eg. Given an imagePath of /path/to/images, background-image: image-url('image.png') will compile to background-image: url("/path/to/images/image.png")

outputStyle

outputStyle is a String to determine how the final CSS should be rendered. Its value should be one of 'nested', 'expanded', 'compact', 'compressed'. [Important: currently the argument outputStyle has some problem which may cause the output css becomes nothing because of the libsass, so you should not use it now!]

sourceComments

sourceComments is a String to determine what debug information is included in the output file. Its value should be one of 'none', 'normal', 'map'. The default is 'none'. The map option will create the source map file in your CSS destination. [Important: souceComments is only supported when using the file option, and does nothing when using data flag.]

sourceMap

If your sourceComments option is set to map, sourceMap allows setting a new path context for the referenced Sass files. The source map describes a path from your CSS file location, into the the folder where the Sass files are located. In most occasions this will work out-of-the-box but, in some cases, you may need to set a different output.

More information: https://github.com/andrew/node-sass

934 questions
649
votes
23 answers

Error: 'node-sass' version 5.0.0 is incompatible with ^4.0.0

I've created a blank React project, using the command: npx create-react-app on npm v7.0.7 and Node.js v15.0.1 Installed: React v17.0.1, node-sass v5.0.0, Then I tried to import a blank .scss file to the App component: File App.js import…
JDKot
  • 6,643
  • 2
  • 10
  • 12
417
votes
37 answers

Node.js: Python not found exception due to node-sass and node-gyp

Suddenly in one of my jenkins environment build has started failing, while in local machine it seems to be working fine as i have python installed, From the logs i was able to detect that the problem is with internal dependency that is node-gyp…
Vipul Panth
  • 5,221
  • 4
  • 16
  • 27
386
votes
39 answers

Error: Node Sass does not yet support your current environment: Windows 64-bit with false

E:\A Prem World\Team_Work_Tasks\Anjali\Anjali_20160524\QuizApp_20160524_01_Anj>ionic serve -l (node:4772) fs: re-evaluating native module sources is not supported. If you are using the graceful-fs module, please update it to a more recent…
Premkumar Agrawal
  • 4,116
  • 2
  • 13
  • 14
231
votes
34 answers

Node Sass does not yet support your current environment: Linux 64-bit with false

Getting this error on Arch Linux with node-sass. I'm using it with gulp-sass. Node Sass does not yet support your current environment: Linux 64-bit with false Versions $ gulp -v [19:43:15] CLI version 3.9.1 [19:43:15] Local version 3.9.1 $ npm…
Jitendra Vyas
  • 148,487
  • 229
  • 573
  • 852
183
votes
3 answers

Vue CLI CSS pre-processor option: dart-sass VS node-sass?

When creating a new project with CLI (v3.7.0), there is an option to choose between dart-sass or node-sass compiler. How do these compare to each other, to be more specific than declared in Vue docs? A Tip on Sass Performance Note that when using…
ux.engineer
  • 10,082
  • 13
  • 67
  • 112
172
votes
15 answers

error: no template named 'remove_cv_t' in namespace 'std'; did you mean 'remove_cv'?

My problem seems similar to this issue, except it happens when I run yarn install in a rails app. When I run yarn install, it runs successfully for some time, then ../src/libsass/src/ast.hpp:1614:25: warning: loop variable 'numerator' of type 'const…
stevec
  • 41,291
  • 27
  • 223
  • 311
132
votes
19 answers

npm install ->Failed at the node-sass@4.5.0 postinstall script

I'm trying to do npm install and an error appears : Failed at the node-sass@4.5.0 postinstall script. I tried to delete node_modules and then reinstall it, same error appears. what will be the solution? node v8.9.3 npm v5.4.2 ionic 3.19.0
Joe Sleiman
  • 2,416
  • 5
  • 25
  • 40
108
votes
4 answers

How to compile or convert sass / scss to css with node-sass (no Ruby)?

I was struggling with setting up libsass as it wasn't as straight-forward as the Ruby based transpiler. Could someone explain how to: install libsass? use it from command line? use it with task runners like gulp and grunt? I have little experience…
Thoran
  • 8,884
  • 7
  • 41
  • 50
77
votes
13 answers

libsass bindings not found when using node-sass in nodejs

I want to use the node-sass module in my node.js v0.12 application to benefit from the performance of libsass. I executed npm i node-sass to install the module, no errors so far. Now the mess starts: If I just open the REPL in a terminal to try out…
TorbenJ
  • 4,462
  • 11
  • 47
  • 84
64
votes
25 answers

npm install with error: `gyp` failed with exit code: 1

I'm try to install modules on Windows 10 using npm 5.6.0. When I enter npm install I get: gyp ERR! configure error gyp ERR! stack Error: `gyp` failed with exit code: 1 gyp ERR! stack at ChildProcess.onCpExit…
dawn
  • 855
  • 1
  • 7
  • 16
60
votes
4 answers

Minify CSS with Node-sass

I'm using SCSS in my NodeJS project and have my script working to turn all my seperate SCSS files into a single CSS file using the following command node-sass -w public/css/scss/style.scss public/css/style.css My only issue is that I also want the…
Matt Leach
  • 839
  • 3
  • 10
  • 15
56
votes
3 answers

The opacity value was changed to 1% after building the Reacjs project

Im building a Reactjs project and using scss instead of css. In the App.scss file, I set opacity: 87%; (note: unit is percent). Everything worked normally (the opacity value still equal 87%) when I run command: yarn start But when I run command:…
Ho Van
  • 601
  • 5
  • 6
55
votes
12 answers

Build Fails: `npm rebuild node-sass --force`

Using n to switch Node versions. I've ran yarn, npm rebuild node-sass --force many many times. And still fails. Getting this error: Node Sass could not find a binding for your current environment This usually happens because your environment has…
GN.
  • 8,672
  • 10
  • 61
  • 126
52
votes
7 answers

NPM node-sass installation fails

I am trying to install node-sass in a project, which perfectly builds and runs on my pc but on my surface I am having major issues when trying to install the packages. Note: I have tryed reinstalling and rebuilding the project several times. Summary…
Maxdola
  • 1,562
  • 2
  • 10
  • 29
44
votes
3 answers

Replace Node-Sass with Dart-Sass in Create React App v3.x

Has anybody done this successfully yet? I currently have node-sass installed in my CRA project and I'm trying to replace it with dart-sass but am experiencing difficulty because the CRA error output is telling me that I need to have node-sass…
Danchez
  • 1,266
  • 2
  • 13
  • 28
1
2 3
62 63