difficulty encountered when attempting to create a new react application using npx create-react-app

PS C:\Users\Khldon\Desktop\react bascs> npx create-react-app my-app

Creating a new React app in C:\Users\Khldon\Desktop\react bascs\my-app.

Installing packages. This might take a couple of minutes.
Installing react, react-dom, and react-scripts with cra-template...

npm ERR! code ERR_SOCKET_TIMEOUT
npm ERR! errno ERR_SOCKET_TIMEOUT
npm ERR! network Invalid response while trying to fetch https://registry.npmjs.org/eslint-config-react-app: Socket timeout
npm ERR! network Network connectivity issue is causing the problem.
npm ERR! network It's likely due to being behind a proxy or having poor network settings.
npm ERR!
npm ERR! If behind a proxy, ensure that the
npm ERR! 'proxy' config is set correctly.  See: 'npm help config'

npm ERR! Full log can be found in:
npm ERR!     C:\Users\Khldon\AppData\Local\npm-cache\_logs\2022-03-10T18_23_30_605Z-debug.log

Installation aborted.
  npm install --no-audit --save --save-exact --loglevel error react react-dom react-scripts cra-template has failed.

Deleting generated file... package.json
Deleting my-app/ from C:\Users\Khldon\Desktop\react bascs
Done.

node-v:16.14.0

Not using a proxy and tried all solutions online without success.

Tried every solution on this thread: npm not working - "read ECONNRESET"

Last lines of log file possibly indicating the issue:

3521 http fetch GET 200 https://registry.npmjs.org/lodash.sortby 261ms (cache miss)
3522 http fetch GET 200 https://registry.npmjs.org/webidl-conversions 494ms (cache miss)
3523 http fetch GET 200 https://registry.npmjs.org/tr46 534ms (cache miss)
3524 timing idealTree:node_modules/workbox-build/node_modules/source-map Completed in 540ms
3525 silly placeDep ROOT <a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="335f5c5752405b1d405c4147514a73071d041d03">[email protected]</a> OK for: <a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="5a2d323b2e2d3d772f28361a6d746b746a">[email protected]</a> want: ^4.7.0
3526 silly placeDep ROOT <a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="0c787e383a4c3d223c223d">[email protected]</a> OK for: <a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="44332c253033236931362804736a756a74">[email protected]</a> want: ^1.0.1
3527 silly placeDep ROOT <a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="3047555259545c1d535f5e46554243595f5e4370041e001e02">[email protected]</a> OK for: <a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="8cfbe4edf8fbeba1f9fee0ccbba2bda2bc">[email protected]</a> want: ^4.0.2
3528 timing idealTree:node_modules/whatwg-url Completed in 5ms
3529 timing idealTree:node_modules/lodash.sortby Completed in 0ms
3530 timing idealTree:node_modules/tr46 Completed in 0ms
3531 timing idealTree:node_modules/webidl-conversions Completed in 0ms
3532 silly placeDep node_modules/workbox-webpack-plugin <a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="becdd1cbccdddb93d3dfcefe8e9088908f">[email protected]</a> OK for: <a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="740311160415171f59071b010617110734455a405a47">[email protected]</a> want: ~0.6.1
3533 timing idealTree:node_modules/workbox-webpack-plugin/node_modules/webpack-sources Completed in 2ms
3534 timing idealTree:node_modules/workbox-webpack-plugin/node_modules/source-map Completed in 0ms
3535 timing idealTree:buildDeps Completed in 5489589ms
3536 timing idealTree:fixDepFlags Completed in 35ms
3537 timing idealTree Completed in 5489651ms
3538 timing command:install Completed in 5489669ms
3539 verbose type system
3540 verbose stack FetchError: request to http://registry.npmjs.org/js-tokens failed, reason: getaddrinfo ENOTFOUND registry.npmjs.org
3540 verbose stack     at ClientRequest.<anonymous> (C:\Users\Khldon\AppData\Roaming\nvm\v16.13.0\node_modules\npm\node_modules\minipass-fetch\lib\index.js:110:14)
3540 verbose stack     at ClientRequest.emit (node:events:390:28)
3540 verbose stack     at Socket.socketErrorListener (node:_http_client:447:9)
3540 verbose stack     at Socket.emit (node:events:402:35)
3540 verbose stack     at emitErrorNT (node:internal/streams/destroy:157:8)
3540 verbose stack     at emitErrorCloseNT (node:internal/streams/destroy:122:3)
3540 verbose stack     at processTicksAndRejections (node:internal/process/task_queues:83:21)
3541 verbose cwd C:\Users\Khldon\Desktop\react bascs\my-app
3542 verbose Windows_NT 10.0.19042
3543 verbose argv "C:\\Program Files\\nodejs\\node.exe" "C:\\Program Files\\nodejs\\node_modules\\npm\\bin\\npm-cli.js" "install" "--no-audit" "--save" "--save-exact" "--loglevel" "error" "react" "react-dom" "react-scripts" "cra-template"
3544 verbose node v16.13.0
3545 verbose npm  v8.1.0
3546 error code ENOTFOUND
3547 error syscall getaddrinfo
3548 error errno ENOTFOUND
3549 error network request to http://registry.npmjs.org/js-tokens failed, reason: getaddrinfo ENOTFOUND registry.npmjs.org
3550 error network This is a problem related to network connectivity.
3550 error network In most cases you are behind a proxy or have bad network settings.
3550 error network
3550 error network If you are behind a proxy, please make sure that the
3550 error network 'proxy' config is set properly.  See: 'npm help config'
3551 verbose exit 1

Answer №1

For more information, check out:

Follow these instructions:

npm config set proxy http://username:password@host:port
npm config set https-proxy http://username:password@host:port

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Leveraging the power of Express.js, transmit local data alongside a

Why can't I display the active user in my view using plain HTML when console log shows it? Here is the code snippet: app.post('/', function (req, res) { var user = { user : req.body.username }; res.render('doctor_hagfish/pets&ap ...

Get the selected row value from a Table and convert it into an array. Then, pass this array as a parameter to another function

I need help with logging and storing selected values from a Table component in React My Table component displays data from an API with checkboxes on each row. I'm using the <Table /> Material UI component for React. The documentation states th ...

I'm encountering an npm deployment issue on Digital Ocean, what could be causing this?

As someone who is new to deployment, I am encountering errors that I cannot seem to resolve using Google. My platform of choice is digital ocean, and here is the error log: npm ERR! cipm can only install packages with an existing package-lock.json or npm-s ...

Fetch a document from a NodeJS Server utilizing Express

Is there a way to download a file from my server to my machine by accessing a page on a nodeJS server? I am currently using ExpressJS and I have attempted the following: app.get('/download', function(req, res){ var file = fs.readFileSync(__d ...

Is there a way to retrieve a session variable within an EJS view template?

After a user logs in, I would like to store their details in the session and be able to access them in ejs templates. How can this be accomplished? app.post('/registration', function(req, res) { var name = req.session.user_name = req.body.us ...

How can I restrict access to localhost:3000 so that only my device can access it within the network?

Currently, I am utilizing express.js for hosting an HTTP server. Is there a method available to restrict access to port 3000 through my IP address for other devices on the network? ...

Retrieving information from Material UI's DataGrid

I am currently working on tables using Material UI. Within the table, there is data that I need to pass to the next component. I attempted to use tableRef = useRef(), but unfortunately, it returned as undefined. Is there a different approach that could b ...

Utilizing References in React Components

One of the challenges I am facing involves a Container that needs references to some of its child components: const Container = () => { const blocks: HTMLDivElement[] = []; return ( <div> <Navigation currentBlock={currentBlock} ...

You cannot dynamically add items to a React chips component from material-ui using an object array

I'm currently facing an issue with the Material-UI chips component. I have a select input containing a list of users. Upon selecting a user, a chip displaying their name appears below the form. However, I am encountering a problem where the chips are ...

Mastering AgGridReact Testing: A Comprehensive Guide Using Jest and Enzyme

Seeking guidance on testing AgGridReact with Jest/Enzyme. I'm attempting to simulate the onGridReady callback that should trigger automatically, but it's not working as expected. Below is a simplified version of my test scenario: import React fr ...

Performing asynchronous operations in React with axios using loops

On the backend, I have a socket set up to handle continuous requests from the server. Now, my goal is to send requests to the backend API continuously until a stop button is clicked. Using a loop for this task is considered bad practice as it never checks ...

Failure to read data and attempting to run a non-existent function

Currently, I am developing an API prototype and encountering an issue with reading data from Google Sheets using Express.js. The problem lies in fetching data from sheet 2 while it works fine for sheet 1. The package I use to read the data is available at: ...

The higher-order component consistently triggers a rerender, disregarding the use of shouldComponent

Here is an example of a higher order component: // HigherOrderComponent.js const withLogging = WrappedComponent => class extends React.Component { componentDidMount() { console.log('Component has mounted'); } render () { return ...

Tips for eliminating a single occurrence with Array.prototype.filter()

I am facing an issue in my React app with the deleteNumberFromList method. This function is designed to remove a specific number from the array by utilizing a setter hook: const [valuesList, setValuesList] = useState<number[]>([]); const deleteNumbe ...

Utilizing the Sheet Elite API - Step-by-Step Guide for Sending Data to a Designated Sheet Through a POST Request

Recently, I've been working on a project that involves using the Sheet Best API to submit data directly to Google Sheets. However, I'm running into an issue where the data is only being sent to the first sheet out of three. Despite having all the ...

Struggling with npm publish following the configuration of Azure Artifacts feed

I'm facing a problem with npm install and npm publish in my Node.js project after setting up authentication with an Azure Artifacts feed. I've followed the documentation and made the required changes to my user and project level .npmrc file http ...

Reorganize child JSON objects into a new object that includes a parent ID

Exploring the realm of JavaScript, I am currently delving into Node.JS to interact with an API and save the data in a SQL Server. Utilizing the "request" and "mssql" Node packages for this task as they possess robust documentation and support. My query re ...

Safari iOS does not display any background for Buttons

Encountering an unusual problem with buttons on iOS devices specifically in Safari browser - the background color isn't being applied like it is on Desktop and Android devices. Here are the CSS properties for the button: export const Button = styled.b ...

Need a module from the main directory

Imagine having these folders: 'C:\\src' // Main directory. 'C:\\src\\inner1' // Contains 'a.js' 'C:\\src\\inner2\\innermost' // Contains 'b.js' ...

Include a carrot icon on a navigation element that is currently active, ensuring it does not disrupt the position of the navigation icon within the container

I am working on a react navigation bar where I want to emphasize each navigation item with a carat when the user is on a specific URL or route. I have been trying to use the :after pseudo-class in Sass to add the carat, but it's not working as expecte ...