CODEWITHSUNDEEP
javascriptnode.jsbuildsassnpm
Om3ga
Om3ga

Reputation: 32823

node-sass does not compile scss file using npm run css command

I am using npm as build tool. I have following line in my package.json file.

"scripts": {
    "css": "node-sass --include ./node_module --include-scss --compress ./src/css/main.scss ./dist/css/style.css",
}

When I run npm run css then it shows below output in terminal

> [email protected] css /Projects/Lab/website
> node-sass --include ./node_module --include-scss --compress ./src/css/main.scss ./dist/css/style.css

But when I check ./dist/css/style.css file, it is empty.

Why and how can I fix this?

UPDATE

Now I am getting below error

/Projects/website/node_modules/node-sass/lib/extensions.js:158
    throw new Error([
    ^

Error: The `libsass` binding was not found in /Projects/website/node_modules/node-sass/vendor/darwin-x64-47/binding.node
This usually happens because your node version has changed.
Run `npm rebuild node-sass` to build the binding for your current node version.
    at Object.sass.getBinaryPath (/Projects/website/node_modules/node-sass/lib/extensions.js:158:11)
    at Object.<anonymous> (/Projects/website/node_modules/node-sass/lib/index.js:16:36)
    at Module._compile (module.js:413:34)
    at Object.Module._extensions..js (module.js:422:10)
    at Module.load (module.js:357:32)
    at Function.Module._load (module.js:314:12)
    at Module.require (module.js:367:17)
    at require (internal/module.js:16:19)
    at Object.<anonymous> (/Projects/website/node_modules/node-sass/lib/render.js:9:12)
    at Module._compile (module.js:413:34)

npm ERR! Darwin 13.4.0
npm ERR! argv "/Users/xafar/.nvm/versions/node/v5.5.0/bin/node" "/Users/xafar/.nvm/versions/node/v5.5.0/bin/npm" "run" "css"
npm ERR! node v5.5.0
npm ERR! npm  v3.3.12
npm ERR! code ELIFECYCLE
npm ERR! [email protected] css: `node-sass --include-scss ./src/css/main.scss ./dist/css/style.css`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] css script 'node-sass --include-scss ./src/css/main.scss ./dist/css/style.css'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the website package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     node-sass --include-scss ./src/css/main.scss ./dist/css/style.css
npm ERR! You can get their info via:
npm ERR!     npm owner ls website
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR!     /Projects/website/npm-debug.log
[nodemon] app crashed - waiting for file changes before starting...

after changing below line in my package.json file.

"css": "node-sass --include-scss ./src/css/main.scss ./dist/css/style.css", // see above for original line.

I am following below blogs in order to make them work.

https://moroccojs.org/tutorials/npm-based-front-end-workflow/ https://medium.com/@brianhan/watch-compile-your-sass-with-npm-9ba2b878415b#.pfupo150c

Upvotes: 2

Views: 2686

Answers (2)

Md Salim Hasan Riad
Md Salim Hasan Riad

Reputation: 71

2021, node-sass is officially deprecated and its recommended to use dart sass instead.

sass syntax changed, and only the new dart-sass supports it.

sass-lang.com/blog/libsass-is-depr...

How do I migrate? If you’re a user of Node Sass, migrating to Dart Sass is straightforward: just replace node-sass in your package.json file with sass. Both packages expose the same JavaScript API.

Upvotes: 1

Mehrshad Farzaneh
Mehrshad Farzaneh

Reputation: 694

There may be a bug in your coded files.
For example, I have a main.scss file in which several files are imported.
My problem was solved by commenting on several imports in the main.scss file:

enter image description here

Also, you can reinstall node_module and clear node cache.

Upvotes: 0

Related Questions