I am trying to follow a tutorial but i run into problems before i even have written a line of code. only terminal commands as seen below:
*PS C:\Users\ruben\OneDrive\Bureaublad\dapp> cd .\client\
PS C:\Users\ruben\OneDrive\Bureaublad\dapp\client> npm init vite@latest
√ Project name: ... ./
√ Select a framework: » react
√ Select a variant: » react
Scaffolding project in C:\Users\ruben\OneDrive\Bureaublad\dapp\client\...
Done. Now run:
npm install
npm run dev
PS C:\Users\ruben\OneDrive\Bureaublad\dapp\client> npm install
added 76 packages, and audited 77 packages in 6s
7 packages are looking for funding
run `npm fund` for details
found 0 vulnerabilities
PS C:\Users\ruben\OneDrive\Bureaublad\dapp\client> npm run dev
> [email protected] dev
> vite
Pre-bundling dependencies:
react
react-dom
react/jsx-dev-runtime
(this will be run only when your dependencies or config have changed)
vite v2.7.10 dev server running at:
> Local: http://localhost:3000/
> Network: use `--host` to expose
ready in 467ms.*
When i go to the localhost i get presented a blank page (in the tutorial it shows a visual and some text.
When i inspect the page i get presented by there errors:
:3000/:1
GET http://localhost:3000/ 500 (Internal Server Error)
localhost/:1
GET http://localhost:3000/_next/static/chunks/fallback/webpack.js?ts=1641050312655
net::ERR_ABORTED 500 (Internal Server Error)
localhost/:1
GET http://localhost:3000/_next/static/chunks/fallback/main.js?ts=1641050312655
net::ERR_ABORTED 500 (Internal Server Error)
localhost/:1
GET http://localhost:3000/_next/static/chunks/fallback/react-refresh.js?
ts=1641050312655 net::ERR_ABORTED 500 (Internal Server Error)
localhost/:1
GET http://localhost:3000/_next/static/chunks/fallback/pages/_app.js?
ts=1641050312655 net::ERR_ABORTED 500 (Internal Server Error)
localhost/:1
GET http://localhost:3000/_next/static/chunks/fallback/pages/_error.js?
ts=1641050312655 net::ERR_ABORTED 500 (Internal Server Error)
Aswel as this issue:
A page or script is accessing at least one of navigator.userAgent, navigator.appVersion, and navigator.platform. Starting in Chrome 101, the amount of information available in the User Agent string will be reduced. To fix this issue, replace the usage of navigator.userAgent, navigator.appVersion, and navigator.platform with feature detection, progressive enhancement, or migrate to navigator.userAgentData. Note that for performance reasons, only the first access to one of the properties is shown. 1 source bubble_compiled.js:1
CodePudding user response:
Make sure that you are using at least npm v6 i just tried this on node v17 and it is working fine on npm v7. The docs that i followed is here
CodePudding user response:
This could be a permission issue. You are working inside OneDrive folder. So there is a probability that OneDrive is constantly watching every change inside the inner folders and blocking access for other applications. Try starting your project anew in another folder. Preferably in 'C:\Users\ruben\Desktop'.