npx create-react-app report errors
Closed this issue · 2 comments
Maicarons2022 commented
Hello developer,
I'm a new in the react and while using templates, I got many errors.
env
nodejs:16.14.0
npm/npx:8.6.0
os:windows10
output
init:
$ npx create-react-app smireact --template windows-ui
npm WARN exec The following package was not found and will be installed: create-react-app
npm WARN deprecated tar@2.2.2: This version of tar is no longer supported, and will not receive security updates. Please upgrade asap.
Creating a new React app in D:\GitHub\smireact.
Installing packages. This might take a couple of minutes.
Installing react, react-dom, and react-scripts with cra-template-windows-ui...
added 1395 packages in 3m
Initialized a git repository.
Installing template dependencies using npm...
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: smireact@0.1.0
npm ERR! Found: react@18.2.0
npm ERR! node_modules/react
npm ERR! react@"^18.2.0" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react@"^17.0.1" from react-windows-ui@4.1.0
npm ERR! node_modules/react-windows-ui
npm ERR! react-windows-ui@"^4.1.0" from the root project
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\xxxxxxxx\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\xxxxxxxxx\AppData\Local\npm-cache\_logs\2022-08-11T14_42_58_602Z-debug-0.log
`npm install --no-audit --save react-windows-ui@^4.1.0 react-router-dom@^6.3.0 web-vitals@^2.1.4` failed
start:
$ npm start
> smireact@0.1.0 start
> react-scripts start
(node:9092) [DEP_WEBPACK_DEV_SERVER_ON_AFTER_SETUP_MIDDLEWARE] DeprecationWarning: 'onAfterSetupMiddleware' option is deprecated. Please use the 'setupMiddlewares' option.
(Use `node --trace-deprecation ...` to show where the warning was created)
(node:9092) [DEP_WEBPACK_DEV_SERVER_ON_BEFORE_SETUP_MIDDLEWARE] DeprecationWarning: 'onBeforeSetupMiddleware' option is deprecated. Please use the 'setupMiddlewares' option.
Starting the development server...
Failed to compile.
Module not found: Error: Can't resolve 'react-router-dom' in 'D:\GitHub\smireact\src'
ERROR in ./src/App.js 7:0-74
Module not found: Error: Can't resolve 'react-router-dom' in 'D:\GitHub\smireact\src'
ERROR in ./src/App.js 8:0-117
Module not found: Error: Can't resolve 'react-windows-ui' in 'D:\GitHub\smireact\src'
ERROR in ./src/index.js 6:0-48
Module not found: Error: Can't resolve 'react-windows-ui/config/app-config.css' in 'D:\GitHub\smireact\src'
ERROR in ./src/index.js 7:0-56
Module not found: Error: Can't resolve 'react-windows-ui/dist/react-windows-ui.min.css' in 'D:\GitHub\smireact\src'
ERROR in ./src/index.js 8:0-52
Module not found: Error: Can't resolve 'react-windows-ui/icons/fonts/fonts.min.css' in 'D:\GitHub\smireact\src'
ERROR in ./src/pages/page0/index.js 5:0-52
Module not found: Error: Can't resolve 'react-windows-ui' in 'D:\GitHub\smireact\src\pages\page0'
ERROR in ./src/pages/page1/index.js 5:0-58
Module not found: Error: Can't resolve 'react-windows-ui' in 'D:\GitHub\smireact\src\pages\page1'
ERROR in ./src/pages/page2/index.js 5:0-104
Module not found: Error: Can't resolve 'react-windows-ui' in 'D:\GitHub\smireact\src\pages\page2'
webpack compiled with 8 errors
How to resolve it? pls
virtualvivek commented
Hi @Maicarons2022 ,
Thanks for opening this issue.
I just checked and there was a dependencies version conflict in the CRA-Template.
Worked on it and now it has been Fixed.
Windows PowerShell
Copyright (C) 2013 Microsoft Corporation. All rights reserved.
PS E:\Github\react-windows-ui> cd ../
PS E:\Github> npx create-react-app my-app --template file:./react-windows-ui/src/cra-template
Creating a new React app in E:\Github\my-app.
Installing packages. This might take a couple of minutes.
Installing react, react-dom, and react-scripts with cra-template-windows-ui...
added 1389 packages in 2m
205 packages are looking for funding
run `npm fund` for details
Initialized a git repository.
Installing template dependencies using npm...
added 5 packages in 8s
205 packages are looking for funding
run `npm fund` for details
Removing template package using npm...
removed 1 package, and audited 1395 packages in 6s
205 packages are looking for funding
run `npm fund` for details
6 high severity vulnerabilities
To address all issues (including breaking changes), run:
npm audit fix --force
Run `npm audit` for details.
Created git commit.
Success! Created my-app at E:\Github\my-app
Inside that directory, you can run several commands:
npm start
Starts the development server.
npm run build
Bundles the app into static files for production.
npm test
Starts the test runner.
npm run eject
Removes this tool and copies build dependencies, configuration files
and scripts into the app directory. If you do this, you can’t go back!
We suggest that you begin by typing:
cd my-app
npm start
Happy hacking!
PS E:\Github>
After Successful Setup
cd my-app
npm start
Windows PowerShell
Copyright (C) 2013 Microsoft Corporation. All rights reserved.
PS E:\Github\my-app> npm start
> my-app@0.1.0 start
> react-scripts start
Compiled successfully!
You can now view my-app in the browser.
Local: http://localhost:3000
On Your Network: http://192.168.43.209:3000
Note that the development build is not optimized.
To create a production build, use npm run build.
webpack compiled successfully
Do let us know if its all set from your side.
Maicarons2022 commented
It's ok now, thank you!
In fect, I used the yarn
after npm reported errors, however, yarn
could reslove the conflicts and the project could run well by the yarn
:)