Create-React-App Unexpected Connection Refused - reactjs

I keep getting the below error when I try to simply create a new react app. I even set up fiddler on my computer and set my proxy to work with that but I am still getting the following error:
ECONNREFUSED 13.107.6.183:443
Click here for the complete log
$ create-react-app testmeup
Creating a new React app in C:\***\source\Dev\testmeup.
Installing packages. This might take a couple of minutes.
Installing react, react-dom, and react-scripts...
yarn add v1.15.2
[1/4] Resolving packages...
error An unexpected error occurred: "https://pkgs.dev.azure.com/AdmInvestorServices/_packaging/test/npm/registry/react: connect ECONNREFUSED 13.107.6.183:443".
info If you think this is a bug, please open a bug report with the information provided in "C:\\****\\source\\Dev\\testmeup\\yarn-error.log".
info Visit https://yarnpkg.com/en/docs/cli/add for documentation about this command.
Aborting installation.
yarnpkg add --exact react react-dom react-scripts --cwd C:\Users\***\Dev\testmeup has failed.
Deleting generated file... package.json
Deleting generated file... yarn.lock
Done.

This appears to be an issue with your proxy settings since when you're running create-react-app <app_name> yarn is unable to resolve the necessary dependencies to set up your new react project, namely: react, react-dom, and react-scripts.
Maybe you could try setting your proxy settings so you can install the necessary libraries create-react-app needs. According to yarn's documentation:
"For backward compatiibilty with npm, Yarn allows passing down npm configuration via environment variables."
So maybe you could try the following and seeing if this helps resolve your issue:
npm config set proxy <proxy_url>
npm config set https-proxy <proxy_url>
where the <proxy_url> is changed to work with your appropriate proxy. Then you can tell yarn to ignore ssl if necessary. Note: Use at your own discretion.
yarn config set strict-ssl false
npm config set <key> <value> sets npm environment variables which yarn can also utilize. In this particular case we are setting the proxy environment variables. Now simply try running the create-react-app command again and it should be able to proceed with setting up the new react project for you.
Hopefully that helps!

Related

Couldn't find any versions for "cra-template-typescript" that matches "latest" in our cache

Trying to follow this guide: How to Build a Simple React app With Express API but when running
npx create-react-app react-express-app --template typescript
I get this output:
npx: installed 98 in 12.964s
Creating a new React app in /home/aioobe/projects/daily-challenge-5/react-express-app.
error Could not open cafile: ENOENT: no such file or directory, open '/etc/pki/tls/certs/ca-bundle.crt'
Installing packages. This might take a couple of minutes.
Installing react, react-dom, and react-scripts with cra-template-typescript...
You appear to be offline.
Falling back to the local Yarn cache.
yarn add v1.22.4
error Could not open cafile: ENOENT: no such file or directory, open '/etc/pki/tls/certs/ca-bundle.crt'
[1/4] Resolving packages...
error Couldn't find any versions for "cra-template-typescript" that matches "latest" in our cache (possible versions are ""). This is usually caused by a missing entry in the lockfile, running Yarn without the --offline flag may help fix this issue.
info Visit https://yarnpkg.com/en/docs/cli/add for documentation about this command.
Aborting installation.
yarnpkg add --exact --offline react react-dom react-scripts cra-template-typescript --cwd /home/aioobe/projects/daily-challenge-5/react-express-app has failed.
Deleting generated file... package.json
Deleting generated file... yarn.lock
Deleting react-express-app/ from /home/aioobe/projects/daily-challenge-5
Done.
Does anyone have any idea of what's going on here?
Did some more googling and someone suggested it was a network issue, so i fiddled with my VPN and it finally worked.
So, if you run into this, check that you have proper network connection working.

Unhandled JS Exception: Requiring unknown module "104"

I have installed React Native Highcharts but while importing the module:
import HighchartsReactNative from '#highcharts/highcharts-react-native';
Getting error Unhandled JS Exception: Requiring unknown module "104". If you are sure the module exists, try restarting Metro. You may also want ti run 'Yarn' or 'npm install' importing the module I got the above error.
I have already restarted the Metro bundler and restarted many times but did not worked.
Ensure the module is installed by checking the folder node_modules/#highcharts/highcharts-react-native
If it is missing, install it with yarn add #highcharts/highcharts-react-native or npm install --save #highcharts/highcharts-react-native
Clear metro cache with watchman watch-del-all and rm -rf $TMPDIR/metro-bundler-cache-*
Restart the bundler resetting the cache with yarn start --reset-cache or npm run start --reset-cache
Reload the bundle in your app (shake and press Restart on the menu)
You could try to clear Metro cache. Please take a look to this gist.
Hope this helps.

npm ERR! Response timeout while trying to fetch https://registry.npmjs.org/react-is (over 30000ms)

When I want to create a react app I'm encountering the following error:
npm ERR! Response timeout while trying to fetch https://registry.npmjs.org/react-is (over 30000ms)
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\info\AppData\Roaming\npm-cache\_logs\2020-04-23T02_54_45_865Z-debug.log
Aborting installation.
npm install --save --save-exact --loglevel error react react-dom react-scripts cra-template has failed.
Deleting generated file... package.json
Deleting app2/ from C:\Users\info
Done.
Sounds like you have a slow connection. Try increasing the timeout from 30s to 60s by adding this to your .npmrc file:
timeout=60000
You could also try adding
prefer-offline=true
if you are trying to save bandwidth or have a slow connection
Note: if you don't have an .npmrc file setup yet, you can create one here
for Windows: C:\Users\{username}\.npmrc
for Mac/Linux ~/.npmrc
Or you can create one in the same directory as your project's package.json file.
I had a slow connection and I updated the timeout value to .npmrc using:
npm set timeout=100000
And to check if the value is updated (Mac): vi ~/.npmrc
Users are extremely likely to face this issue if they are on a slow internet connection. To counter this, you need to increase the timeout in the npm's config file. And here's how to do it:
Find the .npmrc file (located in the nodejs installation folder; in my case, it's in F:\Installations\nodejs\node_modules\npm folder. But for you, it might be in C:\program files folder).
Open the .npmrc file and append this line: timeout=240000 (usually it is 60 seconds I suppose, but since my connection was way slower therefore, I had to increase it to 240 seconds or 4 minutes, you can keep it 120000 for 120seconds)
Save the file
Since create-react-app fails midway, it can easily break npm's package.json file thus leading to this sort of issue:
Unexpected end of JSON input while parsing near
Therefore, before running the npx create-react-app, run the following command: npm cache clean --force as it cleans the cache and (i think) repairs the package.json file.
I was facing the same issue. I Solved it like this:
create a new file with no name just an extinction of .npmrc
open this file in any editor and type timeout = 90000
save the file and in you terminal type
npm cache clean --force
npm install create-react-app
npx create-react-app ./
Note: this error occurs because of slow internet speed
This error occurs due to slow internet connection. Try installing when you get a better speed. If better speed doesn't solve your problem try this.
npm cache verify
npm cache clean --force
I enabled IIS and the issue was solved for me:
do to Control Panel -> Programs -> Programs and Features
click on Turn Windows features on and off
make sure the Internet Information Services is checked
click OK and wait for some minutes
I was facing the same issue when create a react-app using npx create-react app . And i fixed my problem by running the following command.
npm cache clean --force
I hope you find this helpful
I fixed the problem by setting timeout in user local .npmrc file to
timeout=600000
90000 is not enough for downloading many packages for projects with lot dependencies in package.json
In case you are still running into this issue below with the error:
Invalid response body while trying to fetch
https://registry.npmjs.org/eslint-config-react-app: Socket timeout
Run this script: npm install react --registry=https://registry.npmjs.org
and then npx create-react-app mypp
for your react app installation. Happy coding
I fixed the problem by running:
npm config set registry "http://registry.npmjs.org" --global
It appears the problem is related to the following post:
npm install gets stuck at fetchMetadata
And #CptUnlucky's solution worked for me on macOS Catalina 10.15.7, node v16.0.0, npm v7.12.2, nvm v0.38.0
I was facing the same issue and I solved it by enabling the Internet Information service (IIS) feature of the window.
Enabling the IIS
Steps:
Windown + r
Type appwiz.cpl and click OK
click on Turn window features on or off (on the Left top side)
wait some seconds and check the Internet information service option
Now wait until window apply changes.
create project again.
I have faced the same issue. I tried all solutions over StackOverflow or Github discussions but nothing worked.
I changed the .npmrc file under the Users folder in C in Windows and changed the timeout from 30000 to 90000. See if 60000 works!
In my case it was the issue related to npm verison 6.14*
Downgrading to npm verison 6.13.7 solved for me
npm i -g npm#6.13.7
It's also an newly opened issue
you can check more details about it at
https://github.com/npm/cli/issues/1185
You just need to run npm i npm#6.13.7 or npm I -g npm#6.13.7 if you wanna this to be global version.
After that, just to make sure, run " npm -version " to see what version you are using.
Downgrading to npm version 6.13.7 worked for me.
Try this:
npm cache clean --force
npm config rm proxy
npm config rm https-proxy
And remove your node_modules within your user.
In Windows, it is
C:\Users\${select_your_user}\AppData\Roaming\npm\node_modules
I was facing the same issue when running npm install on Docker.
I had to pass the HTTP and HTTPS proxy values to the image while building it.
docker build --build-arg HTTP_PROXY=http://<your_company_proxy> --build-arg HTTPS_PROXY=http://<your_company_proxy>
It worked fine after I passed these parameters.
In my case it was the issue related to npm verison 6.14*
Downgrading to npm verison 6.13.7 solved for me
npm i -g npm#6.13.7
It's also an newly opened issue you can check more details about it at https://github.com/npm/cli/issues/1185
it is works for me
Editing the .npmrc file to 80000 works. If not, globally uninstall create-react-app:
"npm uninstall -g create-react-app" then run "npx create-react-app ./"
I recently have the same issue and following steps would help you.
npm config set registry "http://registry.npmjs.org" --global (sets registry) (Try Again)
Go to you user folder find .npmrc file there and remove content of it.
run npm cache clean --force
still errors - Remove the content of npm base folder usually inside User/AppData/roaming/npm/...
I tried everything including factory resetting my Mac. Then after reinstalling everything and still having the same issue, I typed into the terminal and ran:
npm set timeout=100000
then sat my computer next to my router and ran npx create-react-app again and it worked!
Sometimes it won't work if you use only letters in your app name e.g first I have used "myapp" and that was not working though I have done all the other stuffs correctly like set timeout = 240000 in .npmrc file and run the following commands
npm cache clean --force
npm install create-react-app
npx create-react-app myapp
but that not working for me then I have just changed my project name from myapp -> my-app and it worked perfectly. So, If you are facing the same issue try them out. Hopefully, it saves your time.
I tried many things for 3 days, then i figure out that new versions of nodejs doesn't work so fine for some computers, i downgrade to 16.0.0 and then worked
Regarding npx ...
If you have create-react-app (CRA) globally installed;
it is recommend you uninstall CRA
to ensure that npx always uses the latest version.
When using npx, the global installation isn't used.
But it may interfere (addressed below).
Don't run your React app from your desktop.
Some operating systems may throw an error.
Windows OS users ...
As administrator (for steps #1 & #2), inside your command-line ...
1) uninstall your global version of CRA.
npm uninstall -g create-react-app Mac prefix: sudo
2) Then ...
Run: npx create-react-app my-app Mac prefix: sudo
Above: This will create the latest version of
a React app named: my-app.
This app will be created wherever your command-line is pointing.
3) Open Google Chrome.
4) cd my-app (point your command-line to your project folder).
5) inside your command-line ... Run: npm start

An unexpected error occurred: "https://registry.yarnpkg.com/error-ex/-/error-ex-1.3.2.tgz: Request failed \"404 Not Found\"

When I try to create a new react app with create-react-app, I got the following:
ยป npx create-react-app my-order
Creating a new React app in /Users/ian/myproject/my-order.
Installing packages. This might take a couple of minutes.
Installing react, react-dom, and react-scripts...
yarn add v1.19.0
[1/4] ๐Ÿ” Resolving packages...
[2/4] ๐Ÿšš Fetching packages...
error An unexpected error occurred: "https://registry.yarnpkg.com/error-ex/-/error-ex-1.3.2.tgz: Request failed \"404 Not Found\"".
info If you think this is a bug, please open a bug report with the information provided in "/Users/ian/myproject/my-order/yarn-error.log".
info Visit https://yarnpkg.com/en/docs/cli/add for documentation about this command.
Aborting installation.
yarnpkg add --exact react react-dom react-scripts --cwd /Users/ian/myproject/my-order has failed.
Deleting generated file... package.json
Deleting generated file... yarn.lock
Done.
And my local environment information is like this:
ยป npx create-react-app --info
Environment Info:
System:
OS: macOS 10.14.6
CPU: x64 Intel(R) Core(TM) i7-4870HQ CPU # 2.50GHz
Binaries:
Node: 11.1.0 - /usr/local/bin/node
Yarn: 1.19.0 - ~/.yarn/bin/yarn
npm: 6.7.0 - /usr/local/bin/npm
Browsers:
Chrome: 80.0.3987.100
Firefox: 72.0.2
Safari: 12.1.2
npmPackages:
react: Not Found
react-dom: Not Found
react-scripts: Not Found
npmGlobalPackages:
create-react-app: 2.1.1
Anyone have any idea what's going on here?
Try
yarn install --registry=https://registry.yarnpkg.com/
it worked for me
Sometimes there is a problem accessing npmjs.com and installing scoped packages. Try to check https://status.npmjs.org/
If you use NVM, you might have this problem occur if you switched away from your primary nodejs version that you first had installed, so just change back if you can:
nvm use <original node installation's version>
But, if that doesn't work for you, then in your shoes I'd try reinstalling node directly from the website if I can't just use a non-NVM installation: https://nodejs.org/en/
For some people it seems they have an EACCESS error, and that might be fixed by changing their registry from http to https.
Example using NPM, rather than Yarn:
npm install --registry=https://registry.npmjs.org/
A similar problem: Cannot run npm install from nvm, but working well using source from https://nodejs.org/en/download/
Try with yarn install --registry=https://registry.yarnpkg.com/.
Hope it works!
Try this in your command:
yarn cache clean
yarn
and it will probably work...
I too get the error An unexpected error occurred: "https://registry.yarnpkg.com/has-flag/-/has-flag-4.0.0.tgz: Request failed \"503 Service Unavailable\""
I changed from var to let in my code and It works fine.

Not able to create react app using "create-react-app demo" in ubuntu 14.04 [duplicate]

there is any way for work with create-react-app behind corporate firewall by setting a proxy.
i have setted the proxy on npm and yarn, but this is what i see when try to create-react-app my-app:
Creating a new React app in F:\react\my-app.
Installing packages. This might take a couple of minutes.
Installing react, react-dom, and react-scripts...
You appear to be offline.
Falling back to the local Yarn cache.
yarn add v0.23.4
info No lockfile found.
[1/4] Resolving packages...
error Couldn't find any versions for "react" that matches "latest" in our cache. Possible versions: ""
info Visit https://yarnpkg.com/en/docs/cli/add for documentation about this command.
Aborting installation.
yarnpkg add --exact --offline react react-dom react-scripts has failed.
Deleting generated file... package.json
Deleting my-app / from F:\react
Done.
I had been struggling with this for weeks. What worked for me was to include --use-npm at the end of the command and finally I got rid of the "no lockfile found" error. I sincerely hope this helps someone else struggling with the same issue.
I have had this issue as well, and I solved this with this command:
create-react-app hello-world --use-npm --cache /tmp/empty-cache
As a workaround, try first running yarn add react react-dom react-scripts in an empty folder. This will add the required packages to yarn's local cache. You can then delete that folder and run create-react-app my-app again and it will hopefully work.
Update: Looks like this bug has now been fixed, and should no longer be present in version 1.1.0.
This problem is caused by the fact that the yarn registry is hard-coded in react-scripts to registry.yarnpkg.com: https://github.com/facebookincubator/create-react-app/blob/master/packages/create-react-app/createReactApp.js#L692
As per this pull request, if the yarn registry is not reachable, then it will check to see if you have the https_proxy environment variable set, and then if so it will verify that that server is reachable, instead of the hard-coded yarn registry.
To reiterate, it's not enough to set the proxy/https-proxy configs in npm/yarn - you also need to set the https_proxy environment variable, because that's what create-react-app will check when determining if you are online. For example:
https_proxy=https://my.corporate.proxy create-react-app my-new-project
This solved my problem - See details
npm config set registry "https://registry.npmjs.org"
These settings solved it for me:
npm config set proxy http://username:password#host:port
npm config set https-proxy http://username:password#host:port

Resources