reactjs - Come gestire le versioni dei pacchetti react, react-dom, @types/react e @types/react-dom?

Recentemente, ho aggiornato la versione di react/react-dom nel mio progetto da 16.3.2 a 16.8.6 per poter usare gli hook e, con alcuni piccoli cambiamenti nel mio codice, tutto è andato bene.

Ma stiamo usando TypeScript, e quando cerco di usare React.useState(), il compilatore TypeScript si lamenta e non riesce a compilare: Property 'useState' does not exist on type 'typeof React'.

Penso che il problema sia che i pacchetti @types/react e @types/react-dom non erano aggiornati. Quindi ho provato ad aggiornarli dalla versione 16.3.2 alla 16.8.5 (16.8.6 non esiste per @types/react-dom).

Poi sono riuscito a usare usestate() ma tutto il resto era rotto, il compilatore TypeScript si lamentava di quasi tutti i componenti...

La mia domanda è: cosa dovrei fare? Qual è il modo migliore per aggiornare questi pacchetti? Le versioni devono essere le stesse?

Grazie.

Risposta n. 1

Risposta breve, le versioni di @types/react e @types/react-dom potrebbero non essere le stesse. Devi scegliere le versioni corrette in base alle versioni di typescript e react che stai usando.

Ecco come:

Ad esempio, immagina di usare react 17.x.y. Per questo motivo, dovresti guardare le versioni 17.x.y di @types/react. Per scegliere quella definitiva, dovresti guardare il tag accanto a ciascuna di esse e scegliere quella che corrisponde alla tua versione di typescript (tsX.Y). Immagina di star usando typescript 3.8.x. Potresti scegliere questo pacchetto:

La stessa cosa per @types/react-dom.

Risposta n. 2

import React from 'react';


export default function App() {
  const [state, setState] = React.useState(); 
}

Hai provato in quel modo?

e stai usando i @types giusti nel tuo package.json

"@types/react": "^16.8.14",
"@types/react-dom": "16.8.3",
"typescript": "3.5.3"