Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Angular CLI: 7.0.3 Cannot find module 'node-sass' #12746

Closed
Toso82 opened this issue Oct 25, 2018 · 24 comments
Closed

Angular CLI: 7.0.3 Cannot find module 'node-sass' #12746

Toso82 opened this issue Oct 25, 2018 · 24 comments
Assignees
Labels
area: @angular/cli freq1: low Only reported by a handful of users who observe it rarely severity3: broken state: blocked
Milestone

Comments

@Toso82
Copy link

Toso82 commented Oct 25, 2018

Bug Report or Feature Request (mark with an x)

- [x] bug report -> please search issues before submitting
- [ ] feature request

Command (mark with an x)

- [ ] new
- [ ] build
- [x] serve
- [ ] test
- [ ] e2e
- [ ] generate
- [ ] add
- [ ] update
- [ ] lint
- [ ] xi18n
- [ ] run
- [ ] config
- [ ] help
- [ ] version
- [ ] doc

Versions

Angular` CLI: 7.0.3
Node: 11.0.0
OS: win32 x64
Angular: 7.0.1
... animations, cdk, common, compiler, compiler-cli, core, forms
... http, language-service, material, platform-browser
... platform-browser-dynamic, router, service-worker

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.10.3
@angular-devkit/build-angular     0.10.3
@angular-devkit/build-optimizer   0.10.3
@angular-devkit/build-webpack     0.10.3
@angular-devkit/core              7.0.3
@angular-devkit/schematics        7.0.3
@angular/cli                      7.0.3
@angular/flex-layout              7.0.0-beta.19
@angular/pwa                      0.10.3
@ngtools/webpack                  7.0.3
@schematics/angular               7.0.3
@schematics/update                0.10.3
rxjs                              6.3.3
typescript                        3.1.3
webpack                           4.19.1

Repro steps

 ng new prova
? Would you like to add Angular routing? No
? Which stylesheet format would you like to use? SCSS   [ http://sass-lang.com   ]

ng serve

The log given by the failure

** Angular Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **

Date: 2018-10-25T09:17:54.974Z
Hash: 98b297ee437ab1226eb2
Time: 9888ms
chunk {main} main.js, main.js.map (main) 10.9 kB [initial] [rendered]
chunk {polyfills} polyfills.js, polyfills.js.map (polyfills) 228 kB [initial] [rendered]
chunk {runtime} runtime.js, runtime.js.map (runtime) 6.22 kB [entry] [rendered]
chunk {styles} styles.js, styles.js.map (styles) 17 kB [initial] [rendered]
chunk {vendor} vendor.js, vendor.js.map (vendor) 3.46 MB [initial] [rendered]

ERROR in ./src/styles.scss (./node_modules/@angular-devkit/build-angular/src/angular-cli-files/plugins/raw-css-loader.js!./node_modules/postcss-loader/src??embedded!./node_modules/sass-loader/lib/loader.js??ref--14-3!./src/styles.scss)
Module build failed (from ./node_modules/sass-loader/lib/loader.js):
Error: Cannot find module 'node-sass'
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:587:15)
    at Function.Module._load (internal/modules/cjs/loader.js:513:25)
    at Module.require (internal/modules/cjs/loader.js:643:17)
    at require (internal/modules/cjs/helpers.js:22:18)
    at Object.sassLoader (C:\Users\Giacomo\Documents\Visual Studio 2017\Projects\Angular\prova\node_modules\sass-loader\lib\loader.js:46:72)
i 「wdm」: Failed to compile.

Desired functionality

Compile well

Mention any other details that might be useful

After update NodeJs and latest Angular CLI compile stop to work. I try also to delete all node_module folder and install again the package without solve.

@alan-agius4
Copy link
Collaborator

Which package manager are you using?

This might be because node-sass is listed in optionalDependencies. Thus any errors or failures when installing this dependency will not terminate the installation with a non zero error code.

Kindly check the console output when doing the installation, you should be getting something along SKIPPING OPTIONAL DEPENDENCY.

@Toso82
Copy link
Author

Toso82 commented Oct 25, 2018

@alan-agius4 I see now it is a problem of node-sass with NodeJS 11.


PS C:\Users\Giacomo\Documents\Visual Studio 2017\Projects\Angular\prova> npm install node-sass@latest

> node-sass@4.9.3 install C:\Users\Giacomo\Documents\Visual Studio 2017\Projects\Angular\prova\node_modules\@angular-devkit\build-angular\node_modules\node-sass
> node scripts/install.js

Downloading binary from https://github.com/sass/node-sass/releases/download/v4.9.3/win32-x64-67_binding.node
Cannot download "https://github.com/sass/node-sass/releases/download/v4.9.3/win32-x64-67_binding.node":

HTTP error 404 Not Found

Hint: If github.com is not accessible in your location
      try setting a proxy via HTTP_PROXY, e.g.

      export HTTP_PROXY=http://example.com:1234

or configure npm proxy via

      npm config set proxy http://example.com:8080

> node-sass@4.9.4 install C:\Users\Giacomo\Documents\Visual Studio 2017\Projects\Angular\prova\node_modules\node-sass
> node scripts/install.js

@alan-agius4
Copy link
Collaborator

alan-agius4 commented Oct 25, 2018

@Toso82 upstream issue sass/node-sass#2521, I will keep it open so that once resolved we update our dependency,

@alan-agius4 alan-agius4 reopened this Oct 25, 2018
@alan-agius4 alan-agius4 added freq1: low Only reported by a handful of users who observe it rarely severity3: broken state: blocked area: @angular/cli labels Oct 25, 2018
@alan-agius4 alan-agius4 self-assigned this Oct 25, 2018
@ngbot ngbot bot added this to the needsTriage milestone Oct 25, 2018
@Adam-Michalski
Copy link

I had the same problem.
I made this steps to fix it:
npm install --global windows-build-tools
After success instalation remove node_modules
and run npm install if it passes without errors which means node sass would download, extract and compile you are good to go.

ng serve

This worked for me.

@alaminfirdows
Copy link

I've run npm install --global windows-build-tools, removed node_modules folder then run npm install. But got same error.

ERROR in ./src/styles.scss (./node_modules/@angular-devkit/build-angular/src/angular-cli-files/plugins/raw-css-loader.js!./node_modules/postcss-loader/src??embedded!./node_modules/sass-loader/lib/loader.js??ref--14-3!./src/styles.scss) Module build failed (from ./node_modules/sass-loader/lib/loader.js): Error: Cannot find module 'node-sass'

Can you help in another way?

@akehir
Copy link

akehir commented Oct 31, 2018

@alaminfirdows : The easiest solution is probably just downgrading to node 10 (nvm i 10.13.0). There is another issue with building gprc with node 11, so it's not the most stable right now (grpc/grpc-node#594).

If you insist on using node 11, you can try your luck with rebuilding node sass, after your install (npm rebuild node-sass). If that works, you should be good to go - if it fails you need to fix the build from source until node-sass releases binary packages.

@clydin
Copy link
Member

clydin commented Oct 31, 2018

The CLI also supports dart-sass as an alternative to node-sass. If installed via npm/yarn within the project, the CLI will use it instead of node-sass. dart-sass is a pure JavaScript version of the sass/scss preprocessor.

@alaminfirdows
Copy link

@akehir Thanks for your solution, I uninstall node 11 and install 10.13.0 It's working now.

@Kenya-West
Copy link

They released version 4.10.0 of node-sass, so you can run npm install node-sass@4.10.0 --no-save and enjoy life with Node v11

@clydin
Copy link
Member

clydin commented Nov 5, 2018

Closing as resolved.

@sinhuemx
Copy link

sinhuemx commented Mar 2, 2019

Superb! bro @Kenya-West

@Hlakaza
Copy link

Hlakaza commented Mar 5, 2019

They released version 4.10.0 of node-sass, so you can run npm install node-sass@4.10.0 --no-save and enjoy life with Node v11

This worked for me

@richjava
Copy link

richjava commented Mar 9, 2019

Also, try running npm audit fix to update your dependencies, I did so and didn't need to install node-sass separately.

@SantiagoIlli
Copy link

Also, try running npm audit fix to update your dependencies, I did so and didn't need to install node-sass separately.

Worked for me! Thanks!

@james-poulose
Copy link

james-poulose commented Mar 19, 2019

Running npm install --save-dev node-sass solved my issue

@mumakau
Copy link

mumakau commented May 15, 2019

Running npm install --save-dev --unsafe-perm node-sass will solve the issue

@PanchakshariPM
Copy link

Thank you @mumakau. "npm install --save-dev --unsafe-perm node-sass" solved my issue.

@Davicho-Dev
Copy link

Hi, I had the same problem.
My solution was to install the LTS version of node since I was using the current version.

@aleemkhan
Copy link

Give read and write permissions to your main project directory and its enclosing items. Then do an npm install. It worked for me.

@deepak5627
Copy link

deepak5627 commented Jun 11, 2019

They released version 4.10.0 of node-sass, so you can run npm install node-sass@4.10.0 --save and enjoy life with Node v11 , "@angular-devkit/build-angular": "latest version",
"@angular/cli": "latest version",

Thank you

@Zadahmad
Copy link

Zadahmad commented Jun 26, 2019

npm install node-sass

https://stackoverflow.com/questions/48147896/error-in-cannot-find-module-node-sass

@ashriv2020
Copy link

@alaminfirdows : The easiest solution is probably just downgrading to node 10 (nvm i 10.13.0). There is another issue with building gprc with node 11, so it's not the most stable right now (grpc/grpc-node#594).

If you insist on using node 11, you can try your luck with rebuilding node sass, after your install (npm rebuild node-sass). If that works, you should be good to go - if it fails you need to fix the build from source until node-sass releases binary packages.

downgrading to node 10 helped me to resolve this issue. Thanks a lot :)

@abhijithcraj
Copy link

My problem is solved with npm install --save-dev node-sass

@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Sep 9, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
area: @angular/cli freq1: low Only reported by a handful of users who observe it rarely severity3: broken state: blocked
Projects
None yet
Development

No branches or pull requests