Issue while trying to create new project

npm ERR! code ERESOLVE npm ERR! ERESOLVE unable to resolve dependency tree npm ERR! npm ERR! While resolving: react-complete-guide@0.1.0 npm ERR! Found: react@18.0.0 npm ERR! node_modules/react npm ERR! react@“^18.0.0” from the root project npm ERR! npm ERR! Could not resolve dependency: npm ERR! peer react@“<18.0.0” from @testing-library/react@12.1.5 npm ERR! node_modules/@testing-library/react npm ERR! @testing-library/react@“^12.0.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\adamr\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\adamr\AppData\Local\npm-cache_logs\2022-04-12T04_05_01_315Z-debug-0.log npm install --no-audit --save @testing-library/jest-dom@^5.14.1 @testing-library/react@^12.0.0 @testing-library/user-event@^13.2.1 web-vitals@^2.1.0 failed

[morenoisidro]

This should be solved after the recent v5.0.1 release. Try running npx create-react-app again.

[dhruv-panchal211]

I found the solution.

create-react-app is not updating index.js as per the new react V18

so you need to modify index.js file as follow

import React from ‘react’; import {createRoot} from ‘react-dom/client’; import ‘./index.css’; import App from ‘./App’; // import reportWebVitals from ‘./reportWebVitals’;

const container = document.getElementById(‘root’); const root = createRoot(container)

root.render( <React.StrictMode> <App /> </React.StrictMode>, )

// If you want to start measuring performance in your app, pass a function // to log results (for example: reportWebVitals(console.log)) // or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals // reportWebVitals();