npm install error

[cyuno]

I get an npm install error running on windows 10 node 8.0.0. npm 5.0.3:

Microsoft Windows [Version 10.0.14393]
(c) 2016 Microsoft Corporation. All rights reserved.

C:\WINDOWS\system32>cd c:\Users\xxxxx\JavaScript\React\LearningReact1sEd_2017\learning-react\chapter-09\color-organizer

c:\Users\xxxxx\JavaScript\React\LearningReact1sEd_2017\learning-react\chapter-09\color-organizer>npm -v
5.0.3

c:\Users\xxxxx\JavaScript\React\LearningReact1sEd_2017\learning-react\chapter-09\color-organizer>npm install
npm WARN prefer global [email protected] should be installed with -g

[email protected] install c:\Users\xxxxx\JavaScript\React\LearningReact1sEd_2017\learning-react\chapter-09\color-organizer\node_modules\node-sass
node scripts/install.js

Downloading binary from https://github.com/sass/node-sass/releases/download/v4.5.1/win32-x64-57_binding.node
Cannot download "https://github.com/sass/node-sass/releases/download/v4.5.1/win32-x64-57_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

[email protected] install c:\Users\xxxxx\JavaScript\React\LearningReact1sEd_2017\learning-react\chapter-09\color-organizer\node_modules\fsevents
node install

[email protected] postinstall c:\Users\xxxxx\JavaScript\React\LearningReact1sEd_2017\learning-react\chapter-09\color-organizer\node_modules\node-sass
node scripts/build.js

Building: C:\Program Files\nodejs\node.exe c:\Users\xxxxx\JavaScript\React\LearningReact1sEd_2017\learning-react\chapter-09\color-organizer\node_modules\node-gyp\bin\node-gyp.js rebuild --verbose --libsass_ext= --libsass_cflags= --libsass_ldflags= --libsass_library=
gyp info it worked if it ends with ok
gyp verb cli [ 'C:\Program Files\nodejs\node.exe',
gyp verb cli 'c:\Users\xxxxx\JavaScript\React\LearningReact1sEd_2017\learning-react\chapter-09\color-organizer\node_modules\node-gyp\bin\node-gyp.js',
gyp verb cli 'rebuild',
gyp verb cli '--verbose',
gyp verb cli '--libsass_ext=',
gyp verb cli '--libsass_cflags=',
gyp verb cli '--libsass_ldflags=',
gyp verb cli '--libsass_library=' ]
gyp info using [email protected]
gyp info using [email protected] | win32 | x64
gyp verb command rebuild []
gyp verb command clean []
gyp verb clean removing "build" directory
gyp verb command configure []
gyp verb check python checking for Python executable "python2" in the PATH
gyp verb which failed Error: not found: python2
gyp verb which failed at getNotFoundError (c:\Users\xxxxx\JavaScript\React\LearningReact1sEd_2017\learning-react\chapter-09\color-organizer\node_modules\which\which.js:13:12)
gyp verb which failed at F (c:\Users\xxxxx\JavaScript\React\LearningReact1sEd_2017\learning-react\chapter-09\color-organizer\node_modules\which\which.js:68:19)
gyp verb which failed at E (c:\Users\xxxxx\JavaScript\React\LearningReact1sEd_2017\learning-react\chapter-09\color-organizer\node_modules\which\which.js:80:29)
gyp verb which failed at c:\Users\xxxxx\JavaScript\React\LearningReact1sEd_2017\learning-react\chapter-09\color-organizer\node_modules\which\which.js:89:16
gyp verb which failed at c:\Users\xxxxx\JavaScript\React\LearningReact1sEd_2017\learning-react\chapter-09\color-organizer\node_modules\isexe\index.js:42:5
gyp verb which failed at c:\Users\xxxxx\JavaScript\React\LearningReact1sEd_2017\learning-react\chapter-09\color-organizer\node_modules\isexe\windows.js:36:5
gyp verb which failed at FSReqWrap.oncomplete (fs.js:152:21)
gyp verb which failed python2 { Error: not found: python2
gyp verb which failed at getNotFoundError (c:\Users\xxxxx\JavaScript\React\LearningReact1sEd_2017\learning-react\chapter-09\color-organizer\node_modules\which\which.js:13:12)
gyp verb which failed at F (c:\Users\xxxxx\JavaScript\React\LearningReact1sEd_2017\learning-react\chapter-09\color-organizer\node_modules\which\which.js:68:19)
gyp verb which failed at E (c:\Users\xxxxx\JavaScript\React\LearningReact1sEd_2017\learning-react\chapter-09\color-organizer\node_modules\which\which.js:80:29)
gyp verb which failed at c:\Users\xxxxx\JavaScript\React\LearningReact1sEd_2017\learning-react\chapter-09\color-organizer\node_modules\which\which.js:89:16
gyp verb which failed at c:\Users\xxxxx\JavaScript\React\LearningReact1sEd_2017\learning-react\chapter-09\color-organizer\node_modules\isexe\index.js:42:5
gyp verb which failed at c:\Users\xxxxx\JavaScript\React\LearningReact1sEd_2017\learning-react\chapter-09\color-organizer\node_modules\isexe\windows.js:36:5
gyp verb which failed at FSReqWrap.oncomplete (fs.js:152:21) code: 'ENOENT' }
gyp verb check python checking for Python executable "python" in the PATH
gyp verb which succeeded python C:\Python36\python.EXE
gyp verb check python version C:\Python36\python.EXE -c "import platform; print(platform.python_version());" returned: "3.6.0\r\n"
gyp verb could not find "C:\Python36\python.EXE". checking python launcher
gyp verb could not find "C:\Python36\python.EXE". guessing location
gyp verb ensuring that file exists: C:\Python27\python.exe
gyp ERR! configure error
gyp ERR! stack Error: Can't find Python executable "C:\Python36\python.EXE", you can set the PYTHON env variable.
gyp ERR! stack at PythonFinder.failNoPython (c:\Users\xxxxx\JavaScript\React\LearningReact1sEd_2017\learning-react\chapter-09\color-organizer\node_modules\node-gyp\lib\configure.js:483:19)
gyp ERR! stack at PythonFinder. (c:\Users\xxxxx\JavaScript\React\LearningReact1sEd_2017\learning-react\chapter-09\color-organizer\node_modules\node-gyp\lib\configure.js:508:16)
gyp ERR! stack at c:\Users\xxxxx\JavaScript\React\LearningReact1sEd_2017\learning-react\chapter-09\color-organizer\node_modules\graceful-fs\polyfills.js:284:29
gyp ERR! stack at FSReqWrap.oncomplete (fs.js:152:21)
gyp ERR! System Windows_NT 10.0.14393
gyp ERR! command "C:\Program Files\nodejs\node.exe" "c:\Users\xxxxx\JavaScript\React\LearningReact1sEd_2017\learning-react\chapter-09\color-organizer\node_modules\node-gyp\bin\node-gyp.js" "rebuild" "--verbose" "--libsass_ext=" "--libsass_cflags=" "--libsass_ldflags=" "--libsass_library="
gyp ERR! cwd c:\Users\xxxxx\JavaScript\React\LearningReact1sEd_2017\learning-react\chapter-09\color-organizer\node_modules\node-sass
gyp ERR! node -v v8.0.0
gyp ERR! node-gyp -v v3.6.2
gyp ERR! not ok
Build failed with error code: 1
npm WARN [email protected] No repository field.

npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] postinstall: node scripts/build.js
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] postinstall script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\xxxxx\AppData\Roaming\npm-cache_logs\2017-06-18T05_53_06_349Z-debug.log

c:\Users\xxxxx\JavaScript\React\LearningReact1sEd_2017\learning-react\chapter-09\color-organizer>

[MoonTahoe]

Are you still receiving this error with node-sass?

[MoonTahoe]

Some windows users have experienced problems with node-sass. I have included some links below that may help with troubleshooting your node-sass installation. I have also recently updated all of the npms in this repo to the latest versions. You may want to update your repo and try again.

Finally, you don't need the sass to run the react. Here is a copy of the CSS that is used for the color-organizer. Simply remove all references to scss, scss files, and scss loaders in your project and use this stylesheet instead:

html, body, div#react-container {
  min-height: 100%;
}
h1 {
  margin: 0;
  padding: 0;
}
body {
  margin: 0;
  padding: 0;
  background: rgba(255, 255, 255, 1);
  background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(229, 229, 229, 1) 100%);
}
body div.app {
  display: flex;
  flex-direction: column;
  height: 100%;
}
input {
  outline: none;
}
form.add-color {
  width: 100%;
  display: flex;
}
form.add-color > :first-child {
  flex-grow: 1;
}
form.add-color input, form.add-color button {
  margin: 0.5em;
  padding: 0.25em;
  font-size: 1.2em;
  border-radius: 5px;
}
form.add-color input[type="color"] {
  padding: 0;
  height: 2em;
}
form.add-color button {
  background-color: green;
  color: white;
  border: none;
}
section.color {
  box-shadow: 3px 3px 8px 1px rgba(178, 178, 178, 1);
  height: 235px;
  border: 2px solid rgba(229, 229, 229, 1);
  border-bottom-color: rgba(127, 127, 127, 1);
  border-right-color: rgba(127, 127, 127, 1);
  margin: 1em;
  padding: 0;
  flex-basis: 100%;
  display: flex;
  flex-wrap: wrap;
  position: relative;
}
@media screen and (min-width: 700px) {
  section.color {
    flex-basis: calc(50% - 2em - 4px);
  }
}
@media screen and (min-width: 1100px) {
  section.color {
    flex-basis: calc(33.33333% - 2em - 4px);
  }
}
@media screen and (min-width: 1600px) {
  section.color {
    flex-basis: calc(25% - 2em - 4px);
  }
}
@media screen and (min-width: 2000px) {
  section.color {
    flex-basis: calc(16.66666% - 2em - 4px);
  }
}
section.color h1 {
  font-family: Verdana, sans-serif;
  text-align: center;
  padding: 0.5em;
  flex-basis: calc(100% - 1em);
}
section.color button {
  position: absolute;
  top: 0.5em;
  right: 0.5em;
  flex-basis: calc(12% - 1em);
  text-align: right;
  background: rgba(255, 255, 255, 1);
  background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(229, 229, 229, 1) 100%);
  padding: 0.75em;
  border-radius: 0.5px;
}
section.color > div:last-child {
  display: flex;
  justify-content: center;
  width: 100%;
  margin-top: 0.5em;
}
section.color div.color {
  height: 100px;
  flex-basis: 100%;
}
section.color div.time-ago {
  position: absolute;
  bottom: 0.5em;
  right: 0.5em;
  font-family: monospace;
  color: rgba(127, 127, 127, 1);
}
div.color-list {
  flex-grow: 1;
  display: flex;
  flex-wrap: wrap;
  text-align: center;
  overflow: scroll;
}
nav {
  display: flex;
  justify-content: space-around;
  background-color: black;
  color: white;
}
nav h1 {
  display: none;
}
nav a {
  color: white;
  font-family: Arial, sans-serif;
  font-size: 2em;
  text-decoration: none;
  padding: 0.5em;
}
nav a.selected {
  color: #900;
}
div.star {
  cursor: pointer;
  height: 25px;
  width: 25px;
  margin: 2px;
  float: left;
  background-color: rgba(127, 127, 127, 1);
  clip-path: polygon(50% 0%, 63% 38%, 100% 38%, 69% 59%, 82% 100%, 50% 75%, 18% 100%, 31% 59%, 0% 38%, 37% 38%);
}
div.star.selected {
  background-color: red;
}

If you want to try to debug node-sass on windows here are some resources:

• sass troubleshooting
• node-sass github issue