Another React Native version mismatch - reactjs

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

Related

TypeError: Cannot set property 'reactRoot' of undefined

I'm developing a frontend for my API using Next JS and Typescript. I have made changes to the code that has caused this a Type Error to occur whenever I attempt to build, run in dev mode or lint.
Usually this would be fairly easy to debug - however the type error is not present in my own files but instead Next JS's:
Any help would be appreciated.
Thanks in advance!
The issue was caused by a version mismatch between react-dom and the other NextJS packages - I'd removed react-dom as a dependency as I was unaware that NextJS depended on it, so when it was added again it downloaded the latest version "^18.0.0" instead of "17.0.2".
Remove next and reinstall it. It will install the latest version of next and correct react version.
npm uninstall next
npm install next

React server won't start after installing styled-components

Disclaimer: this is my first question on Stack Overflow, so apologies if it's not formatted correctly. Please let me know how I can improve it or if more details are needed.
I tried to install styled-components for my React app with the following command npm install --save styled-components.
Before I did this, my server started up just fine with npm start.
After install, React tries to start up the development server but it stops and returns the following errors:
cacheEntry.sizeOnlySource = new SizeOnlySource(size);
TypeError: SizeOnlySource is not a constructor
at updateFileWithReplacementSource (project-directory/node_modules/webpack/lib/Compiler.js:756:37)
at updateWithReplacementSource (project-directory/node_modules/webpack/lib/Compiler.js:738:8)
at processMissingFile (project-directory/node_modules/webpack/lib/Compiler.js:801:8)
at project-directory/node_modules/webpack/lib/Compiler.js:843:10
at Immediate.<anonymous> (project-directory/node_modules/memfs/lib/volume.js:698:17)
Initially, I tried uninstalling the styled-components package. Same errors. Then, I tried updating webpack with npm update webpack.
I googled the errors but they were all for problems that seemed unrelated or that are now fixed.
Support Webpack 4.29.0 breaking change
output.futureEmitAssets option breaks compatibility with source map upload plugins
library target umd - Uncaught TypeError: x is not a constructor
I did come across a post on Stack Overflow explaining that --save is no longer necessary as of npm version 5.0.0. Perhaps it's the source of the error?
Note that I installed the styled-components package on a separate branch of my project, but the server still won't start when I switch to the main branch and I'm getting the same errors.
Honestly, I have no idea what's going wrong or how to fix it. Any help or guidance would be greatly appreciated.
Edit: before the Starting development server... line I get after running npm start, there's some kind of message about webpack being deprecated. I hadn't noticed that before, but it flashes by too quickly for me to read it and I can't scroll up to see the message. I created a new React project from scratch to see if the server would start. It does, but I'm still getting the aforementioned messages.

Receiving error when creating new app using create react app

For some reason when trying to create a new app using create react app, it results in errors everytime. Anybody know what's going on?
Error Stack
Have you tried it without the additional --use-npm flags at the end?
npx create-react-app user-onboarding
cd user-onboarding
npm start
Official docs
Edit: Yeah, reading your errors in the screenshot it appears that the --use-npm flag is causing it to use npm which has outdated versions available, but npx always finds the newest versions. Which is a big reason it is the preferred method for installing create-react-app
If you have your heart set on using npm you can always do an npm update before running it again.

React Native "The expo SDK requires Expo to run. .... this code is not running on Expo."

I am coding with React Native. I don't see that when I first create react-native app for check running. When I implements my code see that. My purpose is generate apk.
app.json
build.gradle
index.js (index.android.json)
App package.json
Solved
Result: I solved my problem with npm install. I would like say many month after.
If anyone's getting this error after upgrading Expo, try restarting your simulator - that fixed it for me.
Here is my experience if someone using expo sees those error message.
I accidentally installed expo manually in my project which was version 29.0.0.
I was using version 28.0.0 of expo sdk, so it may have crashed inside.
What I did:
manually upgrade sdkVersion of app.json to 29.0.0.
change sdk version to 29.0.0 for react-native.
Had exactly the same error - fresh machine, fresh npm, only one version of expo installed.
Turns out, expo requires you to build it as an app before it can send it to the expo app properly (at least on Android). This is easiest done by:
Adding an "android" section to app.json, with the contents "package": "uk.co.yourcompany.yourpackagename" (this is required by android packages. It can be complete garbage, but should follow that format - a backwards domain name)
running expo build:android and following the instructions to sign up to expo's servers and build the app
then restarting expo start
Not sure if this is documented anywhere though, so may be a new thing?
Another thing to try is to move your node_modules folder away (or maybe delete it, up to you) and re-run npm install
According to the official tutorial: https://facebook.github.io/react-native/blog/2017/03/13/introducing-create-react-native-app.html
If you want to use expo in your application, you must create it in the following way
npm i -g create-react-native-app
create-react-native-app my-project
cd my-project
npm start
This will start the React Native packager and print a QR code. Open it in the Expo app to load your JavaScript.
as I see your code has files that are not necessary, such as build.gradle and index.js, the structure that create-react-native-app creates is different and easier to use
I was getting the same error after updating the expo-cli to version 3.0.6.
By looking at my package.json I noticed the expo-cli version installed on my computer is not the same as package.json. so I changed it to "expo-cli": "^3.0.6" and ran npm install || yarn, then the error disappeared!

Material-ui response to breaking change in React 15.4.0? "Cannot resolve module 'react/lib/EventPluginHub'"

React v 15.4.0 was released this morning and seems to have included a change that broke react-tap-event-plugin v1.0.0 producing this error:
$ npm build
> myProject#0.1.47 build /.../myProject
> node scripts/build.js
Creating an optimized production build...
Failed to create a production build. Reason:
Module not found: Error: Cannot resolve module 'react/lib/EventPluginHub' in /.../myProject/node_modules/react-tap-event-plugin/src
(note: I cleaned up the output a little)
According to THIS react-tap-event issue log version 2.0.0 of react-tap-event fixes the build problem. However, material-ui is still using react-tap-event version 1.0.0. What are the options here? The only options I can think of are:
Downgrade react and other packages as described in the link above
Wait for Material-UI to upgrade to react-tap-event 2.0.0
Any other solutions here? I'm pretty much dead in the water if I wanted to use react 15.4.0, as far as I can tell.
Almost make sure you update the react-tap-event-plugin to the right version of react.
material-ui version 0.16.3 is released to address the problem.
I had the same problem. I resolved it by going through next steps:
- delete `"react": "{your-version}"` line from package.json;
- delete node_modules dir;
- run `npm i`;
- run `npm i react --save`.
in React 16.4 removes a lot of internals (#121) this plugin depends on and will break the plugin.
https://www.npmjs.com/package/react-tap-event-plugin
as solution with new release of React uninstall thia plugin and deleted any imports and uses from source Reaction Commerce: TypeError: require(...).__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED is undefined
and
Is react-tap-event-plugin still needed in 2018?
i removed react-tap-event-plugin from my reactjs project. it work for me

Resources