Question Encounter with an unknown page

[SaeedP]

Hello,

When I try to run the react/ASP.core sample application I encounter with this image:

Meet Google Drive – One place for all your files

(TimeoutException: The create_react_app server did not start listing for request within the timeout period of () seconds )

Do you know what is wrong?

regards,

Saeed

 

[Skydiver]

Use React with ASP.NET Core

Learn how to get started with the ASP.NET Core Single Page Application (SPA) project template for React and Create React App (CRA).

docs.microsoft.com

 

[SaeedP]

Use React with ASP.NET Core

Learn how to get started with the ASP.NET Core Single Page Application (SPA) project template for React and Create React App (CRA).

docs.microsoft.com

Yes, I use the template with react-ASP.netCore.

More info:

When I cd to ClientApp folder and then:

npm install
npm start

in the command line get this error:

npm : npm ERR! code ENOENT
At line:1 char:1
+ npm start
+ ~~~~~~~~~
    + CategoryInfo          : NotSpecified: (npm ERR! code ENOENT:String) [], RemoteException
    + FullyQualifiedErrorId : NativeCommandError

npm

ERR!

syscall
open

npm
ERR!
path
H:\react_Asp.netCore_try\logobuilder1\package.json

npm
ERR!
errno
-4058

npm

ERR!

enoent
ENOENT: no such file or directory, open 'H:\react_Asp.netCore_try\logobuilder1\package.json'

npm

ERR!

enoent
This is related to npm not being able to find a file.

npm

ERR!

enoent




npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\Saeed\AppData\Roaming\npm-cache\_logs\2020-12-20T00_13_01_448Z-debug.log

Version of node and npm:
node.js 14.15.1

npm 6.14.8

ClientApp package.json:

{
  "name": "logobuilder1",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "bootstrap": "^4.1.3",
    "jquery": "^3.4.1",
    "merge": "^1.2.1",
    "oidc-client": "^1.9.0",
    "react": "^16.0.0",
    "react-dom": "^16.0.0",
    "react-router-bootstrap": "^0.25.0",
    "react-router-dom": "^5.1.2",
    "react-scripts": "^3.4.1",
    "reactstrap": "^8.4.1",
    "rimraf": "^2.6.2"
  },
  "devDependencies": {
    "ajv": "^6.9.1",
    "cross-env": "^5.2.0",
    "typescript": "^3.7.5",
    "eslint": "^6.8.0",
    "eslint-config-react-app": "^5.2.0",
    "eslint-plugin-flowtype": "^4.6.0",
    "eslint-plugin-import": "^2.20.1",
    "eslint-plugin-jsx-a11y": "^6.2.3",
    "eslint-plugin-react": "^7.18.3",
    "nan": "^2.14.1"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "scripts": {
    "start": "rimraf ./build && react-scripts start",
    "build": "react-scripts build",
    "test": "cross-env CI=true react-scripts test --env=jsdom",
    "eject": "react-scripts eject",
    "lint": "eslint ./src/"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}

Visual studio community version 2019 and the endest version of ASP.net core.

thanks,

 

[Skydiver]

This is sounding more like an NodeJS issue than a C# issue. Anyway the messages above all seem to indicate that npm can't find or access the file "H:\react_Asp.netCore_try\logobuilder1\package.json"

 

[JohnH]

I tried the link @Skydiver posted, did some tests and they were all successfull:

First test I did the command "dotnet new react -o my-new-app" then opened the generated .csproj in that folder. Then used Build in VS, which resulted in mentioned "restores npm dependencies" that took a little while.
Also the "npm start" and run CRA server independently did work for this project.

Second test I created another app with same command, and opened the .csproj. Here I went directly for "npm install" (which installed dependencies) and "npm start". Then modified startup.cs for independent CRA server and ran the project directly.

My package.json does look the same as yours by the way.

200+ MB for this test project is awesome too.

 

[SaeedP]

Thanks for testing the project. I'm not sure if I can understand your answer exactly.

Can you please simply tell me which one of my steps were wrong? I just ran the ASP.net Core template in visual studio 2019.
But can't install npm and run it!

What is your suggestion?

These are my beginning steps to react.

thanks

 

[JohnH]

My point was just that I followed the walkthrough in that article and it worked without problems for me. It was my first meet with React too, I installed latest Node.js 14.15.3, and of course have latest VS update 16.8.3.
Since it was unclear what exactly you were doing when talking about the npm install/start commands I also tried another new project and did the npm commands without building the project first, and that worked too as I wrote.

I'm not sure what steps and modifications you may have taken, but have you tried just creating a new project following the instructions in the article? I see no reason if you do the same in same environment why it also won't work for you.

I also noticed you had a H:\ path error, if that is not a local drive try working on a local drive first. I used to work off a network share myself for some time and found it could give unexpected troubles. Now I just work locally and sync to network share for backups once in a while.

 

[SaeedP]

thanks, let me try again.

 

[SaeedP]

Thanks for your answer. I could make the temple.