10

I have just discovered React. I would like to install the latest stable version of React (17.0.2), but I can't create a new project based on React 17.

Can you help me?

$] npm --version
8.5.5

$] node --version
v16.15.0

I tried version 18, but many dependencies that I want to use are not up to date for version 18.

I did the following:

$] npx create-react-app sample-11
$] cd sample-11
$] cat package.json
{
  "name": "sample-11",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@testing-library/jest-dom": "^5.16.4",
    "@testing-library/react": "^13.2.0",
    "@testing-library/user-event": "^13.5.0",
    "react": "^18.1.0",
    "react-dom": "^18.1.0",
    "react-scripts": "5.0.1",
    "web-vitals": "^2.1.4"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": [
      "react-app",
      "react-app/jest"
    ]
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}

Then I updated the package.json by replacing 18.1.0 to 17.0.2. I update this lines:

"react": "^17.0.2"
"react-dom": "^17.0.2"

rm -rf node_modules
rm package-lock.json
npm install

I get the error:

npm ERR! Could not resolve dependency:
npm ERR! peer react@"^18.0.0" from @testing-library/react@13.2.0

So, I update the package.json by removing "@testing-library/react"

npm install

Ok.

npm start

Compiled with problems:

ERROR in ./src/index.js 5:0-40

Module not found: Error: Can't resolve 'react-dom/client' in '/home/dev/Projets/node-projects/sample-11/src'
Mark Rotteveel
  • 100,966
  • 191
  • 140
  • 197
No Name
  • 162
  • 1
  • 3
  • 6
  • 1
    Please don't edit questions to add things like "solved" to the title, or add the solution into the question. If you managed to solve the problem with Ahmet's answer, then please accept their answer. If you did something else to solve it, add an **answer** and accept that after the timeout. Accepting an answer is what marks a question as solved on Stack Overflow. – Mark Rotteveel May 13 '22 at 15:04

2 Answers2

14

After making a new project, in package.json we update this line

"react": "^17.0.2"
"react-dom": "^17.0.2"

then delete package-lock.json and node_modules and then apply

npm install
Ahmet Firat Keler
  • 2,603
  • 2
  • 11
  • 22
6

try like this

"@testing-library/jest-dom": "^5.11.4",
"@testing-library/react": "^11.1.0",
"@testing-library/user-event": "^12.1.10",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-router-dom": "^6.3.0",
"react-scripts": "5.0.1",
"typescript": "^4.7.4",
"web-vitals": "^2.1.4"

},

Marckvaldo Wallas
  • 61
  • 1
  • 1