The recently updated @types/react@18 major version has changed component definitions to remove having children as a prop by default. This causes errors if you have multiple copies of @types/react in your project. To fix this, tell your package manager to resolve @types/react to a single version. Type '{}' is not assignable to type 'ReactNode'

nom.md

• The recently updated @types/react@18 major version has changed component definitions to remove having children as a prop by default. This causes errors if you have multiple copies of @types/react in your project. To fix this, tell your package manager to resolve @types/react to a single version. OR Type '{}' is not assignable to type 'ReactNode’

  • NPM v 8.

    You can use [overrides](https://docs.npmjs.com/cli/v8/configuring-npm/package-json) like so:

    {
      "overrides": {
        "@types/react": "^18.0.0"
      }
    }
    

    Note that you might still have to do some manual package-lock.json fixing with [email protected] (and below) until npm/cli#4599is released.

  • NPM < 8

    You will need to fix the version for @types/react package because many react libraries have dependency set as @types/react : "*", which will take the latest version of the package. (I suppose they just released version 18)

    To do that you can add this in your package.json

    "resolutions": {
      "@types/react": "^17.0.38"
    }
    
    

    It will just work fine with yarn, but if you are using npm, then you will also need to add this in "scripts" section of your package.json

    "preinstall": "npm install --package-lock-only --ignore-scripts && npx npm-force-resolutions"
    
    

    This will simply use npm-force-resolutions package to fix versions from resolutions.

    And then after doing npm install, your app should work just fine.