npm i shards-react fails on windows

Bankole2000 commented 3 years ago

Tried installing shards-react from a tutorial. Specifically this tutorial on Traversy Media's channel by @jherr.

Npm install command npm i shards-react fails with the following error

npm WARN deprecated popper.js@1.16.1: You can find the new Popper v2 at @popperjs/core, this package is dedicated to the legacy v1
npm WARN deprecated axios@0.18.1: Critical security vulnerability fixed in v0.21.1. For more information, see https://github.com/axios/axios/pull/3410
npm WARN deprecated iltorb@2.4.5: The zlib module provides APIs for brotli compression/decompression starting with Node.js v10.16.0, please use it over iltorb

> iltorb@2.4.5 install C:\xampp\htdocs\projects\nodejs\graphchat\client\node_modules\iltorb
> node ./scripts/install.js || node-gyp rebuild

info looking for cached prebuild @ C:\Users\koles\AppData\Roaming\npm-cache\_prebuilds\ee308d-iltorb-v2.4.5-node-v83-win32-x64.tar.gz
http request GET https://github.com/nstepien/iltorb/releases/download/v2.4.5/iltorb-v2.4.5-node-v83-win32-x64.tar.gz
http 404 https://github.com/nstepien/iltorb/releases/download/v2.4.5/iltorb-v2.4.5-node-v83-win32-x64.tar.gz
WARN install No prebuilt binaries found (target=14.4.0 runtime=node arch=x64 libc= platform=win32)

C:\xampp\htdocs\projects\nodejs\graphchat\client\node_modules\iltorb>if not defined npm_config_node_gyp (node "C:\Users\koles\AppData\Roaming\nvm\v14.4.0\node_modules\npm\node_modules\npm-lifecycle\node-gyp-bin\\..\..\node_modules\node-gyp\bin\node-gyp.js" rebuild )  else (node "C:\Users\koles\AppData\Roaming\nvm\v14.4.0\node_modules\npm\node_modules\node-gyp\bin\node-gyp.js" rebuild )
gyp ERR! find VS
gyp ERR! find VS msvs_version not set from command line or npm config
gyp ERR! find VS VCINSTALLDIR not set, not running in VS Command Prompt
gyp ERR! find VS checking VS2019 (16.9.31205.134) found at:
gyp ERR! find VS "C:\Program Files (x86)\Microsoft Visual Studio\2019\Community"
gyp ERR! find VS - "Visual Studio C++ core features" missing
gyp ERR! find VS could not find a version of Visual Studio 2017 or newer to use
gyp ERR! find VS looking for Visual Studio 2015
gyp ERR! find VS - not found
gyp ERR! find VS not looking for VS2013 as it is only supported up to Node.js 8
gyp ERR! find VS
gyp ERR! find VS **************************************************************
gyp ERR! find VS You need to install the latest version of Visual Studio
gyp ERR! find VS including the "Desktop development with C++" workload.
gyp ERR! find VS For more information consult the documentation at:
gyp ERR! find VS https://github.com/nodejs/node-gyp#on-windows
gyp ERR! find VS **************************************************************
gyp ERR! find VS
gyp ERR! configure error
gyp ERR! stack Error: Could not find any Visual Studio installation to use
gyp ERR! stack     at VisualStudioFinder.fail (C:\Users\koles\AppData\Roaming\nvm\v14.4.0\node_modules\npm\node_modules\node-gyp\lib\find-visualstudio.js:121:47)
gyp ERR! stack     at C:\Users\koles\AppData\Roaming\nvm\v14.4.0\node_modules\npm\node_modules\node-gyp\lib\find-visualstudio.js:74:16
gyp ERR! stack     at VisualStudioFinder.findVisualStudio2013 (C:\Users\koles\AppData\Roaming\nvm\v14.4.0\node_modules\npm\node_modules\node-gyp\lib\find-visualstudio.js:351:14)
gyp ERR! stack     at C:\Users\koles\AppData\Roaming\nvm\v14.4.0\node_modules\npm\node_modules\node-gyp\lib\find-visualstudio.js:70:14
gyp ERR! stack     at C:\Users\koles\AppData\Roaming\nvm\v14.4.0\node_modules\npm\node_modules\node-gyp\lib\find-visualstudio.js:372:16
gyp ERR! stack     at C:\Users\koles\AppData\Roaming\nvm\v14.4.0\node_modules\npm\node_modules\node-gyp\lib\util.js:54:7
gyp ERR! stack     at C:\Users\koles\AppData\Roaming\nvm\v14.4.0\node_modules\npm\node_modules\node-gyp\lib\util.js:33:16
gyp ERR! stack     at ChildProcess.exithandler (child_process.js:310:5)
gyp ERR! stack     at ChildProcess.emit (events.js:315:20)
gyp ERR! stack     at maybeClose (internal/child_process.js:1051:16)
gyp ERR! System Windows_NT 10.0.19042
gyp ERR! command "C:\\Program Files\\nodejs\\node.exe" "C:\\Users\\koles\\AppData\\Roaming\\nvm\\v14.4.0\\node_modules\\npm\\node_modules\\node-gyp\\bin\\node-gyp.js" "rebuild"
gyp ERR! cwd C:\xampp\htdocs\projects\nodejs\graphchat\client\node_modules\iltorb
gyp ERR! node -v v14.4.0
gyp ERR! node-gyp -v v5.1.0
gyp ERR! not ok
npm WARN shards-react@1.0.3 requires a peer of react@^16.6.3 but none is installed. You must install peer dependencies yourself.
npm WARN shards-react@1.0.3 requires a peer of react-dom@^16.6.3 but none is installed. You must install peer dependencies yourself.
npm WARN bootstrap@4.6.0 requires a peer of jquery@1.9.1 - 3 but none is installed. You must install peer dependencies yourself.
npm WARN react-datepicker@2.16.0 requires a peer of react@^16.9.0 but none is installed. You must install peer dependencies yourself.
npm WARN react-datepicker@2.16.0 requires a peer of react-dom@^16.9.0 but none is installed. You must install peer dependencies yourself.
npm WARN bootstrap@4.1.3 requires a peer of jquery@1.9.1 - 3 but none is installed. You must install peer dependencies yourself.
npm WARN wp5-starter-react@1.0.1 No description
npm WARN wp5-starter-react@1.0.1 No repository field.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.13 (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.13: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})

npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! iltorb@2.4.5 install: `node ./scripts/install.js || node-gyp rebuild`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the iltorb@2.4.5 install 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\koles\AppData\Roaming\npm-cache\_logs\2021-04-16T22_51_33_384Z-debug.log

attempted solutions

Installing node-gyp
Deleting package-lock.json file and re-running npm install
Installing Visual Studio Community 2019

Still no luck... Any help would be much appreciated

Bankole2000 commented 3 years ago

Working Solution

Never mind - Found a working solution (and it was actually right there in the error message)

gyp ERR! find VS **************************************************************
gyp ERR! find VS You need to install the latest version of Visual Studio
gyp ERR! find VS including the "Desktop development with C++" workload.
gyp ERR! find VS For more information consult the documentation at:
gyp ERR! find VS https://github.com/nodejs/node-gyp#on-windows
gyp ERR! find VS **************************************************************

Steps to resolve

Install Visual Studio Community
After installation run Visual Studio Installer
Select Modify option on your current Visual Studio Installation
Select and install Desktop Develmopment with C++ Workload with default options

After that npm i shards-react works with no problems

Hope this helps someone

darizabalo commented 3 years ago

that shouldn't be the fix. Since the project is DEAD, I've just forked and fixed it myself.

Change this line in package.json:

"shards-react": "darizabalo/shards-react#master",

Then you should migrate to a better choice like react-bootstrap, same I'll do ASAP.

DesignRevision / shards-react