I have a project created with Create React App. The documentation regarding how to update the React version seems to be pretty poor.
There is some documentation here https://facebook.github.io/create-react-app/docs/updating-to-new-releases . This seems ambiguous though - are these instructions just to update CRA itself and react-scripts? I have followed the instructions - my react-scripts is up to date at v2.1.1, but my React version is only 16.5.2 - I need 16.6 for a certain feature.
Updating react-scripts will not update your React version, you need to do that yourself by updating both react and react-dom (must be the same). Check this and this. I was confused about this too!
Related
I have project with massive amount of dependencies. It uses react 16.8. I need to update React to a specific version: React: 17.0.2
How to do it automatically? I don't want to check each package if it is compatible with this version of React.
It seems all existing automatic methods update to the latest version only(npm-check-updates).
To change the React version your project is using you need to run the following command
npm install –save react#<version>
, where <version> is a variable. You should substitute it for the desired version of React.
I created a 0.69.1 React Native app that came with React 18.0.0. Are these versions pinned to each other, or is it okay to update React to 18.2.0?
React Native 0.69.1 has a peer dependency on React with version "18.0.0" (exactly that version) (from package.json). So the short answer is no, you cannot change
the version of React to 18.2.0 while keeping React Native at 0.69.1.
It looks like RN 0.70.x is going to have a peer dependency on React with version "18.1.0" (again from package.json), so you can update both when RN 0.70.0 is released.
Typescript is added to the version 16 react application created with create react app.
I have installed the latest v.18 version of #types/react and #types/react-dom, but I would like to know if it is a problem that the version is different from react.
Thank you.
npx typesync will resolve type syncing issues. The script checks your package.json and searches the web for the #types version of your package, if one is not already installed. This may also remove the #types packages should you no longer need it.
You can go a step further and add this in your package.json:
“postinstall”: “npx typesync”
Now every time you install or update your packages you’ll automatically run the postinstall script!
Yes, as you'll have TS types for React 18, but JS code for React 16. For example, you may be able to import a new feature from React 18 but get a runtime error because you only have React 16.
You can solve this by using #types/react and #types/react-dom version 16 until you're ready to upgrade to React 18.
I have a Vite/React/Typescript/Yarn monorepo that contains two applications and some shared components. I'm having trouble getting HMR working when running vite dev.
The example repo is here: https://github.com/jakeboone02/em-hmr-test. If you run yarn && yarn start:app1, open http://localhost:3012/, then edit any of the components and save, the page will reload instead of just replacing the component in place.
The repo is a stripped down version of the actual proprietary code. I tried converting all the exports to defaults as suggested in this discussion question answer, but the page still reloads on every change.
Is there something wrong with the Vite config that is preventing HMR from working?
Turns out I was using the deprecated #vitejs/plugin-react-refresh instead of the newer, shinier #vitejs/plugin-react. Repo has been updated.
I'm getting a React Native version mismatch.
JavaScript version: 0.51.0
Native version: 0.52.0
I know there are others who have posted similar online but I simply don't understand what I need to do to resolve it, and as I'm supposed to avoid asking for help in other posts I am starting a new one!
I've closed Terminals and run build again as suggested elsewhere, considered changing Expo versions but unsure if I need to, and how. Anyone got a simply-to-explain solution?
Which version of what do I need to change?
Thanks
The issue of mismatch is related to the changing of your react-native version without properly updating peer dependencies and native projects.
If your project is using Expo, try following the upgrade guidelines here offered from Facebook.
Upgrading to new React Native versions
Found under.. "Create React Native App projects"
The document reference in will give you working mappings.
Once updated, run in your project root.
npm prune && npm install
# OR
yarn
Afterward start your app with your cache cleared.
npm start --reset-cache
# or
yarn start --reset-cache