In my package.json I have:
...
"devDependencies": {
...
"react-devtools": "^4.14.0",
...
},
"resolutions": {
"react-devtools-core": "4.14.0"
}
when i try to run yarn it shows something like this
warning Resolution field "react-devtools-core#4.14.0" is incompatible with requested version "react-devtools-core#4.25.0"
in the warning, I want to know where version #4.25.0 is coming from
I even removed every reference of react-devtools-core and react-devtools from yarn.lock, remove the node_modules folder and run yarn again, but still the same.
and when the app runs this is what is shows in React Native Debugger
it says Devtools 4.25.0-....
So where is the 4.25.0 coming from?
I do know how to resolve the overall issue, but I just want to understand the reason for the above happening.
Your react native debugger comes with dev tools 4.25.0. You just need to put the same version in your resolution and it should be fine.
Hello there I am getting some error in my terminal and its say i need to use 4.4.0 version and my current version is ...
In my project my current typescript version is given below,
"typescript": "^4.4.2",
"typedoc": "^0.21.8",
"react-scripts": "^3.4.4",
"#typescript-eslint/eslint-plugin": "^4.29.3",
"#typescript-eslint/parser": "^4.29.3",
Moreover, when I am trying to run npm run dev commands or npx eslint . is error are showing me which is given below,
=============
WARNING: You are currently running a version of TypeScript which is not
officially supported by #typescript-eslint/typescript-estree.
You may find that it works just fine, or you may not.
SUPPORTED TYPESCRIPT VERSIONS: >=3.3.1 <4.4.0
YOUR TYPESCRIPT VERSION: 4.4.2
Please only submit bug reports when using the officially supported
version.
=============
How can i fix this issue and I have done a lot of research in google but nothing is working. It would be great help for me.
I wouldn't downgrade my Typescript, as you will miss out on newer TS features - I would find a way to update #typescript-eslint/typescript-estree.
You might not have this installed directly and this might be a dependancy of another package, #typescript-eslint/experimental-utils which is dependancy of #typescript-eslint/eslint-plugin for instance, so track down the parent package in your yarn.lock / package.lock file and bump it, as a result it should bump #typescript-eslint/typescript-estree too.
Try using a typescript version between >=3.3.1 <4.4.0.
Here you have the list of typescript versions available.
After changing the version, remove node_modules folder and package-lock.json file. Then execute npm install
I'm building a react application that depends on a third-party package (proprietary, not open sourced unfortunately), lets call it tslib. The package.json of tslib depends on many different package, but the two of interest are the following:
"react-router": "5.1.2",
"react-router-dom": "^5.1.2",
In the main application (lets call it mainapp), depends on tslib, and has the following in it's package.json:
"dependencies": {
"#githubrepo/tslib": "39.2.0",
},
it has no other non-dev dependencies. The issue im seeing is that when i build my application locally (note, this does not happen in production envs) using webpack and try to load the index page, i see the following:
Which is actually happening because there are two versions of both react-router and react-router dom being included (discovered using 'webpack-bundle-analyzer'). When I delete the version in my tslib, and re-webpack, the issue goes away. Does anyone know how I can go about fixing this problem using webpack config?
when I am trying to execute npm start it works fine, but when i try to run my application by expo the process goes till 100% and after that nothing happens. I am not getting what is exact issue over there. I am having following things in package.json.... please help me to resolve this issue.
{
"name": "ProMeeting",
"version": "0.1.0",
"private": true,
"devDependencies": {
"jest-expo": "~29.0.0",
"react-native-scripts": "^1.14.0",
"react-test-renderer": "16.3.1"
},
"main": "./node_modules/react-native-scripts/build/bin/crna-entry.js",
"scripts": {
"start": "react-native-scripts start",
"eject": "react-native-scripts eject",
"android": "react-native-scripts android",
"ios": "react-native-scripts ios",
"test": "jest"
},
"jest": {
"preset": "jest-expo"
},
"dependencies": {
"#babel/preset-react": "^7.0.0-beta.56",
"expo": "^29.0.0",
"firebase": "^5.3.1",
"native-base": "^2.7.2",
"react": "16.3.1",
"react-native": "^0.55.4",
"react-native-firebase": "^4.3.8",
"react-native-vector-icons": "^5.0.0",
"react-navigation": "^2.11.2"
}
}
Screenshot added for illustration purpose
It seems there are multiple reasons why this could happen. I tried to run other apps on my simulator, restarted my simulator and even tried to delete the build folders and rebuild from scratch, but none of these approaches solved the issue.
What finally worked was restarting the React Native Debugger that I had on in the background the entire time.
You can also check the Network tab of React Native Debugger if you've enabled Offline throttling. Disabling it should also solve the issue in some cases.
In my case this always happened when I remote JS debugging was turned on. The JS bundle would load to 100%, but then the app was stuck. React Native Debugger could not connect, with the error message Another debugger is already connected.
After trying all kinds of things (cache resets, restarting Metro builder, restarting simulator) without any luck, I remembered that the only "other debugger" I had ever used were the Chrome Devtools, so I quit Chrome, and immediately everything was working again.
Turns out, even though I had closed the Chrome tab where I had been debugging the app, some background process in Chrome was still attached as a debugger to the app (also after reboots of the simulator). Then it hit some kind of breakpoint or exception on startup, so it paused, and all I could see was the Downloading Javascript bundle 100% message.
This is how I resolved the issue in Mac.
My screen was stuck at Downloading javascript bundle 100%
Select Simulator, Press (Command + D) in Mac, the simulator will display the set of options.
The Application will now load
In my case, my code worked in Android, but not in iOS simulator.
SplashScreen.preventAutoHide(); was the problem.
I called the method twice, App.js and Main.js, respectively.
After removing it in the App.js, it worked.
(I think restarting the React Native Debugger helped as well)
react-native-firebase often cause same issue.
below is official integration guide of react-native-firebase.
https://rnfirebase.io/docs/v5.x.x/installation/ios
B) At the beginning of the didFinishLaunchingWithOptions:(NSDictionary *)launchOptions method add the following line:
[FIRApp configure];
"It is recommended to add the line within the method BEFORE creating the RCTRootView. Otherwise the initialization can occur after already being required in your JavaScript code - leading to app not initialised exceptions."
Do you have GoogleService-Info.plist?
Did you pod install?
Did you Hardware > Erase all Contents and settings in simulator?
I also stuck at the same problem and did every possible thing but it not worked, I revert every change but still the issue is there..
I created my own solution and it works perfectly for me, maybe it might help someone, you can try it with Apple and Android too
Update expo-cli and react-native with npm update -g expo-cli and npm update -g react-native
Uninstall expo app on emulator or device and reinstall it
Create new project with expo init project_name (use your original project name, rename the previous for backup).
Try to run this new blank app in your expo app, it should run properly.
Now install every dependency from non working package.json one by one or in bulk but without giving version using command expo install package_name (Manually because it might be possible because of version conflict).
Now add your old project files and directories including app.json and App.js to this new project.
Run your project again with expo start -c command.
And here you go with your working project!
Happy Coding!!!
As of January 2021, your node version may be one of the causes of this problem.
Check your node version using node -v and if the version is 15.x.x, try downgrading the version to 14.15.1:
$ npm install -g n
$ n 14.15.1
In my case, When i was tried with physical device then try to install in simulator. Then its got stuck like it. I solved the problem after stopped the debugger. For that use below steps.
Android:
Go to settings in mobile >> Installed Apps >> choose your app and click on clear Data.
uninstall your existing app and try to install .
IoS:
Uninstall the exist app and try to install as new.
Shake your device and stop debug and try again to install.
Well in my case I removed a for loop that I had in my code and it was enough to fix this issue. Apparently my react app was crashing everytime it run that loop.
in my case ;
I added a new package ( #khanshamshad32/carousel ) v1.0.1 . i guess package has problems and my expo on real device stuck %100.. and im going to delete all of items package.
1- from package.json (relative instance)
2- from package-lock.json (relative instance)
3- from "package name" folder of node_modules
and it did work
You should try setting up a new react-native project and transfer your files to the new project and then try running it again, this issue occurs when build files are missing
well this post is old but lets go,
how I solved this problem for myself:
> install yarn
> run: yarn remove react-native
> run: yarn add react-native
> run: react-native run-android
Please tell me step by step process of upgrading React from version .13 to 15.0.1 .
Update react version in package.json
Delete node_modules folder
Run npm install
install process will fail if there is any version mismatch among other dependencies in package file, console will show the expected compatible version number. Update those and run npm install again.
Once install is complete, then build your application and test. If any error appear due to deprecated code, then you would have to fix those as well.
One of the deprecated syntax from ver 13, is usage of react.render
There you will have to import react-dom and use that to call render. There can be many other potential issues which you may encounter. So test you app properly.
React entries in package.json that I have:
"react": "15.0.1",
"react-addons-perf": "15.0.1",
"react-addons-test-utils": "15.0.1",
"react-addons-update": "15.0.1",
"react-dom": "15.0.1"
All the best!
P.S. This is the process I follow, there may be some other way to do it.
By experience I can say that each version of react-native has breaking changes, for example from version 17 on, you need to remove #override on
public List<Class<? extends JavaScriptModule>> createJSModules()
So my advice is update progressively along with all you project dependencies.