react.dev icon indicating copy to clipboard operation
react.dev copied to clipboard

Unable to run reactjs.org project

Open nagac121 opened this issue 2 years ago • 4 comments

Followed below steps to install node_modules.

fork reactjs.org
cloned the fork to local
cd reactjs.org
yarn

expected result: install node_modules successfully actual result: getting following error.

Error occurring when ran command yarn

error c:\projects\open source\reactjs.org\node_modules\pngquant-bin: Command failed.
Exit code: 1
Command: node lib/install.js
Arguments:
Directory: c:\projects\open source\reactjs.org\node_modules\pngquant-bin
Output:
‼ read ECONNRESET
  ‼ pngquant pre-build test failed
  i compiling from source
  × Error: pngquant failed to build, make sure that libpng-dev is installed
    at c:\projects\open source\reactjs.org\node_modules\bin-build\node_modules\execa\index.js:231:11

after this error I still went ahead and ran Yarn dev and see below error

 ERROR

The gatsby-source-react-error-codes plugin has failed:
Error: read ECONNRESET

not finished source and transform nodes - 0.390s
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

Environment: windows 11 using command prompt as well as powershell, both as admin

nagac121 avatar Mar 04 '23 11:03 nagac121

Hi there. I read your error log and found out you need to install libpng-dev. is it installed in your local machine? if you have not installed it: here is the command on how to install it on your machine using npm command;

npm install imagemin-pngquant --save // to install the latest

OR

npm install [email protected] --save // to install a specific version

Judee-web avatar Mar 08 '23 07:03 Judee-web

I installed libpng-dev and ran yarn dev, it did not work. then, I deleted node_modules and ran yarn and then yarn dev worked. now, my repo is up and running.

nagac121 avatar Mar 09 '23 03:03 nagac121

I am facing same issue. when I ran yarn dev, it gave

 ERROR

The gatsby-source-react-error-codes plugin has failed:
Error: read ECONNRESET

I deleted node_modules from the project ran yarn and then executed command npm install imagemin-pngquant --save which is giving following error.

npm WARN config global `--global`, `--local` are deprecated. Use `--location=global` instead.
npm WARN ERESOLVE overriding peer dependency
npm WARN While resolving: @reach/[email protected]
npm WARN Found: [email protected]
npm WARN node_modules/react
npm WARN   peer react@"17.0.2" from [email protected]
npm WARN   node_modules/react-dom
npm WARN     peer react-dom@"^15.0.0 || ^16.0.0 || ^17.0.0 " from [email protected]
npm WARN     node_modules/react-hot-loader
npm WARN     1 more (the root project)
npm WARN   3 more (react-helmet, react-hot-loader, the root project)
npm WARN
npm WARN Could not resolve dependency:
npm WARN peer react@"15.x || 16.x || 16.4.0-alpha.0911da3" from @reach/[email protected]
npm WARN node_modules/@reach/router
npm WARN   @reach/router@"^1.3.4" from [email protected]
npm WARN   node_modules/gatsby
npm WARN   4 more (gatsby, gatsby-react-router-scroll, gatsby-link, gatsby-react-router-scroll)
npm WARN
npm WARN Conflicting peer dependency: [email protected]
npm WARN node_modules/react
npm WARN   peer react@"15.x || 16.x || 16.4.0-alpha.0911da3" from @reach/[email protected]
npm WARN   node_modules/@reach/router
npm WARN     @reach/router@"^1.3.4" from [email protected]
npm WARN     node_modules/gatsby
npm WARN     4 more (gatsby, gatsby-react-router-scroll, gatsby-link, gatsby-react-router-scroll)
npm WARN ERESOLVE overriding peer dependency
npm WARN While resolving: @reach/[email protected]
npm WARN Found: [email protected]
npm WARN node_modules/react-dom
npm WARN   peer react-dom@"^15.0.0 || ^16.0.0 || ^17.0.0 " from [email protected]
npm WARN   node_modules/react-hot-loader
npm WARN     react-hot-loader@"^4.12.21" from [email protected]
npm WARN     node_modules/gatsby
npm WARN     1 more (gatsby)
npm WARN   1 more (the root project)
npm WARN
npm WARN Could not resolve dependency:
npm WARN peer react-dom@"15.x || 16.x || 16.4.0-alpha.0911da3" from @reach/[email protected]
npm WARN node_modules/@reach/router
npm WARN   @reach/router@"^1.3.4" from [email protected]
npm WARN   node_modules/gatsby
npm WARN   4 more (gatsby, gatsby-react-router-scroll, gatsby-link, gatsby-react-router-scroll)
npm WARN
npm WARN Conflicting peer dependency: [email protected]
npm WARN node_modules/react-dom
npm WARN   peer react-dom@"15.x || 16.x || 16.4.0-alpha.0911da3" from @reach/[email protected]
npm WARN   node_modules/@reach/router
npm WARN     @reach/router@"^1.3.4" from [email protected]
npm WARN     node_modules/gatsby
npm WARN     4 more (gatsby, gatsby-react-router-scroll, gatsby-link, gatsby-react-router-scroll)
npm WARN ERESOLVE overriding peer dependency
npm WARN While resolving: [email protected]
npm WARN Found: [email protected]
npm WARN node_modules/react
npm WARN   peer react@"17.0.2" from [email protected]
npm WARN   node_modules/react-dom
npm WARN     peer react-dom@"^15.0.0 || ^16.0.0 || ^17.0.0 " from [email protected]
npm WARN     node_modules/react-hot-loader
npm WARN     1 more (the root project)
npm WARN   3 more (react-helmet, react-hot-loader, the root project)
npm WARN
npm WARN Could not resolve dependency:
npm WARN peer react@"^0.14.0 || ^15.0.0 || ^16.0.0" from [email protected]
npm WARN node_modules/create-react-context
npm WARN   create-react-context@"0.3.0" from @reach/[email protected]
npm WARN   node_modules/@reach/router
npm WARN
npm WARN Conflicting peer dependency: [email protected]
npm WARN node_modules/react
npm WARN   peer react@"^0.14.0 || ^15.0.0 || ^16.0.0" from [email protected]
npm WARN   node_modules/create-react-context
npm WARN     create-react-context@"0.3.0" from @reach/[email protected]
npm WARN     node_modules/@reach/router
npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR!
npm ERR! While resolving: [email protected]
npm ERR! Found: [email protected]
npm ERR! node_modules/react
npm ERR!   peer react@"17.0.2" from [email protected]
npm ERR!   node_modules/react-dom
npm ERR!     peer react-dom@"^15.0.0 || ^16.0.0 || ^17.0.0 " from [email protected]
npm ERR!     node_modules/react-hot-loader
npm ERR!       react-hot-loader@"^4.12.21" from [email protected]
npm ERR!       node_modules/gatsby
npm ERR!         peer gatsby@"^2.0.0" from [email protected]
npm ERR!         node_modules/babel-plugin-remove-graphql-queries
npm ERR!         22 more (gatsby-plugin-catch-links, gatsby-plugin-feed, ...)
npm ERR!       1 more (gatsby)
npm ERR!     react-dom@"^17.0.2" from the root project
npm ERR!   peer react@">=15.0.0" from [email protected]
npm ERR!   node_modules/react-helmet
npm ERR!     peer react-helmet@"^5.1.3 || ^6.0.0" from [email protected]
npm ERR!     node_modules/gatsby-plugin-react-helmet
npm ERR!       gatsby-plugin-react-helmet@"^3.0.0" from the root project
npm ERR!     react-helmet@"^5.2.0" from the root project
npm ERR!   2 more (react-hot-loader, the root project)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react@"^16.4.2" from [email protected]
npm ERR! node_modules/gatsby
npm ERR!   peer gatsby@"^2.0.0" from [email protected]
npm ERR!   node_modules/babel-plugin-remove-graphql-queries
npm ERR!     babel-plugin-remove-graphql-queries@"^2.9.19" from [email protected]
npm ERR!     2 more (gatsby, gatsby-plugin-typescript)
npm ERR!   peer gatsby@"^2.0.0" from [email protected]
npm ERR!   node_modules/gatsby-plugin-catch-links
npm ERR!     gatsby-plugin-catch-links@"^2.0.0" from the root project
npm ERR!   21 more (gatsby-plugin-feed, gatsby-plugin-glamor, ...)
npm ERR!
npm ERR! Conflicting peer dependency: [email protected]
npm ERR! node_modules/react
npm ERR!   peer react@"^16.4.2" from [email protected]
npm ERR!   node_modules/gatsby
npm ERR!     peer gatsby@"^2.0.0" from [email protected]
npm ERR!     node_modules/babel-plugin-remove-graphql-queries
npm ERR!       babel-plugin-remove-graphql-queries@"^2.9.19" from [email protected]
npm ERR!       2 more (gatsby, gatsby-plugin-typescript)
npm ERR!     peer gatsby@"^2.0.0" from [email protected]
npm ERR!     node_modules/gatsby-plugin-catch-links
npm ERR!       gatsby-plugin-catch-links@"^2.0.0" from the root project
npm ERR!     21 more (gatsby-plugin-feed, gatsby-plugin-glamor, ...)
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See C:\Users\Lenovo\AppData\Local\npm-cache\eresolve-report.txt for a full report.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\Lenovo\AppData\Local\npm-cache\_logs\2023-03-11T06_02_26_727Z-debug-0.log

nagac121 avatar Mar 11 '23 06:03 nagac121

You might want to use docker or learn about it for long term solution. Docker helps you work with different versions of an application using what is called containers to avoid package/dependency conflict.

You can try npm install --force to ignore dependency version conflict.

or

npm install -legacy-peer-deps

Judee-web avatar Mar 15 '23 18:03 Judee-web

Hi there

Can you please share your node js version.

gurnoor-garry avatar Mar 25 '23 07:03 gurnoor-garry

Hi @gurnoor-garry Thanks for taking a look. My node version is v16.16.0

nagac121 avatar Apr 16 '23 05:04 nagac121

You might want to use docker or learn about it for long term solution. Docker helps you work with different versions of an application using what is called containers to avoid package/dependency conflict.

You can try npm install --force to ignore dependency version conflict.

or

npm install -legacy-peer-deps

Are there any steps on how to make this work using docker approach? but I still prefer norma npm i approach if it works!

nagac121 avatar Apr 16 '23 05:04 nagac121