EzDevInfo.com

node-sass

<img class="emoji" title=":rainbow:" alt=":rainbow:" src="https://assets-cdn.github.com/images/icons/emoji/unicode/1f308.png" height="20" width="20" align="absmiddle"> Node.js bindings to libsass node-sass wrapper around libsass

Getting this error while trying to build a simple project using gulp

Error: `libsass` bindings not found. Try reinstalling `node-sass`?

I've tried reinstalling node-sass several times to no avail. What should I try next?

I'm on OS X Yosemite and running node v0.10.24 with node-sass 2.0.1.


Source: (StackOverflow)

Get SASS to autocompile with NodeJS Express and node-sass

I'm developing using node.js, and instead of writing css would like to write SCSS files that auto-compile whenever I refresh the page.

How can I get SASS files to autocompile when using NodeJS, Express and node-sass.


Source: (StackOverflow)

Advertisements

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 node-sass then everything works fine but if I include it in my project files and run node myfile.js then I get the following error message:

Error: `libsass` bindings not found. Try reinstalling `node-sass`?

The module's description at npmjs.com states that there might be a problem with resolving #!/usr/bin/env node under Ubuntu and how to fix this but that is not the case on my machine.
I could not find anything useful so I hope that you might help me.

I'm using node v0.12.2 under Ubuntu 14.10.

P.S.: I already tried to reinstall node-sass but without success. Nothing changes.


Source: (StackOverflow)

libsass bindings not found when running gulp dist

I'm trying to use a gulp project on my Linux machine. The readme for the project tells me to first run sudo npm install -g gulp bower, then in the project directory run sudo npm install and then bower install. Everything up to this point works just fine for me. However, after that I try to run gulp dist and get this error:

Error: `libsass` bindings not found in /[PROJECT DIRECTORY]/trunk/node_modules/gulp-sass/node_modules/node-sass/vendor/linux-x64-14/binding.node. Try reinstalling `node-sass`?

Googling that error produced this: libsass bindings not found when using node-sass in nodejs, which I tried, but that didn't fix anything. When I looked through that directory that gulp said it couldn't find the difference was the linux-x64-14, mine said linux-x64-11, so I'm assuming I have the wrong version? Just for fun I decided to try changing the name of that folder to what it wanted, and I got a different error:

Error: Module did not self-register.

The really strange thing about all this is that when I tried getting this project working on my Windows machine I didn't have any of these issues, it just worked. I have no idea what I'm doing wrong, any ideas?


Source: (StackOverflow)

How can I transpile/compile sass or scss with node-sass and gulp-sass (based on libsass not 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:

  1. install libsass?
  2. use it from command line?
  3. use it with task runners like gulp and grunt?

I have little experience with package managers and even less so with build managers.


Source: (StackOverflow)

How can I make gulp-watch generate CSS file when SASS changes?

Here is my code:

gulp.task('sass', function () {
    gulp.src('./public/stylesheets/*.scss')
        .pipe(sass())
        .pipe(gulp.dest('./public/stylesheets/'));
});

gulp.task('watch-saas', function () {
    watch('./public/stylesheets/*.scss', function () {
        gulp.start('sass');
    });
});

Output:

[19:15:46] Using gulpfile ~/WebstormProjects/mySite/gulpFile.js
[19:15:46] Starting 'watch-saas'...
[19:15:46] Finished 'watch-saas' after 38 ms

Im afraid no CSS. Any ideas how to make this work?

I think my code looks very much like the example code here. And the 'sass' task runs fine on its own.


Source: (StackOverflow)

lib-sass breaking harp on heroku

Interesting problem, Using harp to build a simple app, then deploying it to Heroku, which is proving to be an issue. The last deploy worked flawlessly using the Harp buildpack, But now it's breaking on deploy.

Nothing has changed that should be causing this, no updates to node modules, or node version. the logs and Papertrail are complaining:

Error: `libsass` bindings not found. Try reinstalling `node-sass`?

After this, I branched off and tried to check on lib-sass in

/app/node_modules/harp/node_modules/terraform/node_modules/node-sass/lib/index.js:22

As per the logs, tried reinstalling it, but no avail. Anyone ever run into this? could it be a problem with the buildpack?


Source: (StackOverflow)

Node-sass with multiple input files

I'm using node-sass directly from the command line (a Makefile, really) to build my CSS.

The scss files are in different directories and they don't refer to each other. What I'd want to have is sassify these files to a single CSS output that I can read in from the HTML - with working source maps.

This is the current command I have in the Makefile:

$(OUT_MAIN_CSS): $(SCSS) Makefile $(node-sass)
    cat $(SCSS) > $(TMP_SCSS)
    $(node-sass) --output-style compressed --source-map $(OUT_MAIN_CSS).map $(TMP_SCSS) $@
    rm $(TMP_SCSS)

OUT_MAIN_CSS is out/bundle.css. SCSS is a list of the input files. node-sass is node_modules/.bin/node-sass.

I'd like to have a one-liner and not need a temporary file. Also, I'd like my source map references (for debugging) to lead to the original files, not the temporary file.

node-sass syntax 1

node-sass [options] <input.scss> [output.css]

Here, node-sass insists on having just a single input file. If I have two or more, the second one gets treated as output, and its contents overridden.

There are some options for an "input directory" and "output directory" but I don't want to constrain my build processes by such rather arbitrary restrictions (yes, eventually I shall bend...).

node-sass syntax 2

cat <input.scss> | node-sass [options] > output.css

This is more in line with the Unix mentality. Problem is twofold. My output file is in a subdirectory (out/bundle.css), which confuses source map references since node-sass has no idea of the output path.

There seems to be --source-map-root for that but I didn't get it to work...

I'm clearly placing a square bolt in a round hole here, am I not? How would you do this?

Is the best way to simply have one ring.scss in the root, to gather all the unrelated pieces together, and then sassify that?


Source: (StackOverflow)

SASS, node-sass returns "Invalid UTF-8"

I have a very simple node-sass script:

var sass = require('node-sass');
var stats = {};
sass.render({
    file: "./src/sass/test.scss",
    outFile: "./src/css/test.css",
    success: function(css) {
        console.log(css);
        console.log(stats);
    },
    error: function(error) {
        console.log(error);
    },
    stats: stats
});

console.log(stats);

Which prints in the console:

{
  "status": 3,
  "message": "Invalid UTF-8",
  "code": 3
}

What am I doing wrong?


Source: (StackOverflow)

Node-sass returns a Slow buffer. What is this and how to I convert it to CSS?

I am compiling a static site using node.js. I want to compile sass. I required node-sass and called: a.renderSync({data:"body{h1{color:green}}"}).css. This returned <SlowBuffer 62 6f 64 79 20 68 31 20 7b 0a 20 20 63 6f 6c 6f 72 3a 20 67 72 65 65 6e 3b 20 7d 0a>. What is a slowbuffer? I just want my CSS.

Thanks!


Source: (StackOverflow)

npm intstall: binding.node is missing

I tried to install npm on my local machine (Mac OS) but when I run npm start, it keeps giving me this error with node_sass. Even when I run sudo npm install node_sass it doesn't fix the problem.

Error: You probably need to execute `npm install` to install brunch plugins.                               
Error: `/Users/AnhLe/bloc/anh-jams/node_modules/sass-brunch/node_modules/node-sass/bin/darwin-x64-v8-3.28/binding.node` is missing. Try reinstalling `node-sass`?


npm ERR! Darwin 14.0.0
npm ERR! argv "node" "/usr/local/bin/npm" "start"
npm ERR! node v0.12.0
npm ERR! npm  v2.7.3
npm ERR! code ELIFECYCLE
npm ERR! bloc-rdio-skeleton@0.0.1 start: `brunch watch --server`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the bloc-rdio-skeleton@0.0.1 start script 'brunch watch --server'.
npm ERR! This is most likely a problem with the bloc-rdio-skeleton package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     brunch watch --server
npm ERR! You can get their info via:
npm ERR!     npm owner ls bloc-rdio-skeleton
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR!     /Users/AnhLe/bloc/anh-jams/npm-debug.log

Source: (StackOverflow)

node-sass: tunneling socket could not be established

This error shows up when I try to install node-sass. I need it to let work gulp protractor.

C:\Windows\system32>cd C:\Program Files (x86)\Jenkins\workspace\testnew

C:\Program Files (x86)\Jenkins\workspace\testnew>npm install node-sass
npm WARN package.json testproject@0.0.0 No repository field.
npm WARN package.json 2@0.0.1 No repository field.
-
> node-sass@2.1.1 install C:\Program Files (x86)\Jenkins\workspace\testnew\node_
modules\node-sass
> node scripts/install.js

tunneling socket could not be established, cause=socket hang up

> node-sass@2.1.1 postinstall C:\Program Files (x86)\Jenkins\workspace\testnew\n
ode_modules\node-sass
> node scripts/build.js

Does someone know how to fix this kind of error?


Source: (StackOverflow)

webpack sass-loader doesnt recognize scss method

  "name": "sass-loader",
  "version": "2.0.1",
  "description": "Sass loader for webpack"

sass-loader doesn't compile scss built in method - selector-parse [http://sass-lang.com/documentation/Sass/Script/Functions.html#selector_parse-instance_method]

 ERROR in ./~/css-loader!./~/sass-loader!./js/symbols/svg/toggles/switch.scss
Module build failed: 
    @each $selector in selector-parse(#{&}) {
    ^
      Invalid selector after .show-on-all-pagesselector-parse

any ideas? does node-sass support these built in scss methods? what loader should I use? Is there a webpack loader based on sass command line like grunt-contrib-sass?


Source: (StackOverflow)

Adding two string together node-sass

I'm trying to create a mixin named getFont to simplify the @font-face call. With compass and sass I do this:

@mixin getFont($name, $url){
  @font-face {
    font-family: $name;
    src: url($url+".eot");
    src: url($url+".eot?#iefix") format("embedded-opentype"), 
      url($url+".woff") format("woff"), 
      url($url+".ttf") format("truetype"), 
      url($url+".svg#") format("svg");
    font-weight: normal;
    font-style: normal;
  }
}

Which gives me the desired result using compass, but while using grunt and node-sass I get this:

@font-face {
  font-family: 'font-name';
  src: url($url+".eot");
  src: url($url+".eot?#iefix") format("embedded-opentype"), url($url+".woff") format("woff"), url($url+".ttf") format("truetype"), url($url+".svg#") format("svg");
  font-weight: normal;
  font-style: normal; }

Looks like the compiler is having some trouble adding two strings together?


Source: (StackOverflow)

how to handle syntax errors in node-sass-middleware

I am using node-sass-middleware in an Express 4 app to compile SCSS files. Works great but then I leave out a semi colon and my Express page just hangs because it won't compile the SCSS.

How I can I view any errors that might exist after I make changes before making the site live because I can't have a production site hanging?


Source: (StackOverflow)