React-native: Reloading App not updating for the latest modified code RN 0.61x

[hugoh59]

System:
    OS: macOS Mojave 10.14.5
    CPU: (12) x64 Intel(R) Core(TM) i7-8850H CPU @ 2.60GHz
    Memory: 16.87 MB / 16.00 GB
    Shell: 5.3 - /bin/zsh
  Binaries:
    Node: 10.16.3 - /usr/local/bin/node
    Yarn: 1.19.1 - /usr/local/bin/yarn
    npm: 6.9.0 - /usr/local/bin/npm
    Watchman: 4.9.0 - /usr/local/bin/watchman
  SDKs:
    iOS SDK:
      Platforms: iOS 13.1, DriverKit 19.0, macOS 10.15, tvOS 13.0, watchOS 6.0
  IDEs:
    Android Studio: 3.4 AI-183.6156.11.34.5692245
    Xcode: 11.1/11A1027 - /usr/bin/xcodebuild
  npmPackages:
    react: 16.9.0 => 16.9.0 
    react-native: 0.61.2 => 0.61.2 
  npmGlobalPackages:
    react-native-cli: 2.0.1
    react-native-git-upgrade: 0.2.7

Since this morning, after not doing anything new to my project, the code suddenly stopped updating the view in my Xcode project. I have tried everything reseting the cache, reinstalling watchman, disabling fast refresh but nothing works. It seems as the project is no longer linked to the current version of my code somehow but keeps referring back to previous version.

[react-native-bot]

Thanks for submitting your issue. Can you take another look at your description and make sure the issue template has been filled in its entirety?

👉 Click here if you want to take another look at the Bug Report issue template.

[bockc]

I have the exact same issue. The only state reloaded by RN is the state right after installing the app, any further change won't be executed after a reload. Even by killing the app and starting it again, code modifications don't apply...
I hope there's a fix for this coming soon, I don't wanna redeploy my app from XCode everytime I change a single bit of code.

EDIT: @hugoh59 I just noticed that this occurs only when I enable debugging AND that I use react-native-debugger. Works fine without debugger or if you use the Chrome console. Looks like this is more related to react-native-debugger than react-native itself.

See this react-native-debugger issue

[mtnt]

Live reload still updates code (with the debugger turned on).

UPD: I use Chrome devtools and this happens again...

[hugoh59]

I don't use react-native-debugger but still has this issue since updating to RN 0.61x, what works for me is completely restarting my computer but that's very time consuming.

[mtnt]

@hugoh59 I started new project with RN 0.61.1 and It worked ok including debugging via Chrome console.log and debugger... until this morning - and I did not do anything too (just open my laptop and refresh the simulator)

[bockc]

Are you guys connecting to the Chrome debugger via localhost:8081/debugger-ui ? In my case there's absolutely no issue this way, but I don't really see why this would change anything ?

[mtnt]

And I don`t really see how good code that already worked ok and protected by package-lock and Podfile.lock could be broken without any updates...

[mtnt]

@hugoh59 @bockc is it works well now? It seems ok to me... and yes, I did not do anything to fix it

[hugoh59]

@mtnt I get the exact same issue. It's incomprehensible. It happened to me during the day as well now. It's like ghost code continue to live on even tho the code no longer exists, it still consol log things that I have erased and my code isn't updated.

It's super frustrating I'm wasting hours on looking where this could come from with not result so far. Any help from the team would be appreciated.

[hugoh59]

I still get the issue but it goes away and comes back for no reason. It also happens when I disable fast refresh.

[hugoh59]

I've tried a lot of things including rm -rf .git/index.lock and now it works again, I'm not sure if that's what solved it but try it out in case it ever comes back.

[bockc]

Well I just ran across this same issue right now using the chrome debugger this time. Had to kill the app and the debugger to actually reload my code. This is definitely an issue with the new react-native reload feature as no matter which debugger I use, this seems to occur randomly.

I'd also like some feedback from the team, just to know if they could quickly take a look at it.

@hugoh59 I don't have any .git/index.lock nor .hg/index.lock :/

EDIT: I confirm that as soon as I disable remote debugging my code gets updated. This issue makes RN kind of a pain to work with right now... :(

[hugoh59]

@bockc Yes I did not have one either yesterday and this morning I had one, I'm really lost into what's going on I'm sorry I can't help any further... What I would do is kill everything and restart my computer but even that only works some of the times.

[bockc]

@hugoh59 I still don't have any of these files, so I guess the issue is deeper than a simple lock-file hidden in my project. I thought it could be some sort of cache, but I cleared every single cache related to my development environment and this has not changed anything. Also, my watchman is up to date (v 4.9.0_3). I literally have no clue where this could come from.

[mtnt]

It`s here again! =) And I don`t have the .git/index.lock

[bockc]

@mtnt try disabling remote debugging and enabling it again, works for me most of the time. Not ideal, but this is currently my best option while waiting for a fix from the team.

[mtnt]

I did - no results... It starts working ok while debug is disabled, and returns just on enabling debug

[hugoh59]

Same here...

[jwaldrip]

Having the same issue. This is extremely frustrating.

[ThiagoAlencar12]

My app in react native, i lost every time my states, i'm using hooks of react, useStates but, every time i update my app i lose my data, please help!

[brien-crean]

Has anyone found a workaround so debugging can be enabled? As soon as I enable debugging old code is being loaded. I've tried all of the suggestions above.

Disabling debugging 'fixes' it but I need debugging enabled for some of the modules I use to work correctly. Such a frustrating issue!

[bockc]

@brien-crean Usually what I do when this occurs is I disable Debug, close my debugger, kill the app, press the start button in XCode and then I am fine for a few hours.
Definitely not ideal, but I don't have a better workaround right now.

[brien-crean]

@bockc that unfortunately doesn't work for me. This happens on android and ios for me. I ended up having to clone my project repo to a new location and that resolved it for now

[hugoh59]

Any help from the team would be appreciated. Not sure who to mention here.

[bockc]

I'm not really sure if this really is what is causing the issue, but I noticed that when I got an exception in my code, I have the famous red screen and if I reload by saving my code after that, I will never be able to get the new code state, only the one that was before the exception crash. Once more, I'm not sure if that's exactly what's causing the issue.

[hbarylskyi]

I'm forced to use XCode's console window and attaching to the process. It's kind of a workaround.

[SamiChab]

Same issue here... Can anyone help on how to fix this temporarily?

[bockc]

After encountering this issue more and more and more... I figured that every time I save a modification in an arrow function component, or an arrow function defined and exported in a standalone file, and that Fast refresh is enabled, the code will never be updated anymore when debugging.

That's kind of ironic as react pushes us to use more and more of these features...

[rikur]

Facing the same issue. With debugging enabled, old stale JS is being loaded. At first it used to happen with react-native-debugger, but now it happens with Chrome Devtools as well.

[SamiChab]

Thanks @bockc !
In my case it happened as I updated a module (react-native-webview). As I installed the new version, the JS didn't update anymore...
When I disable debugging, it works again. But as soon as I enable it again, the old code is loaded...
@react-native-bot is this enough informations?

[karthik-balasubramanyam15]

Sometimes when the debugger is connected, the browser caches the data. Try clearing the cache, kill the server and run it again. It worked for me :)

[alitsvin]

Got similar issue. Have no changes even if reload or rebuild the app. Only restarting Metro with resetting cache can reload the app.(

[bockc]

guys, somebody found the solution ! :D

I can confirm that this worked for me using both the Chrome console and the react-native-debugger :)

[xutm]

I've tried a lot of things including rm -rf .git/index.lock and now it works again, I'm not sure if that's what solved it but try it out in case it ever comes back.

It take me a lot of time to solve.
Just rm -rf .git/index.lock .

[kozillla]

I have the opposite problem. I use expo-gl package to run openGL on RN . It requires RN debugger to be disabled. Everything is fine until I will not turn it on. Once the debugger is on, the latest code will only be reloaded when debug mode stays enabled. When I disable debug mode, RN does not reload the latest code anymore (even through force Reload also Fast Refresh seems to be completely ignored by RN in such a scenario). Then pretty much the whole project is not usable anymore as I am not able to reload code with disable debugger, and I can't enable debugger on openGL projects as it will cause the app to crash.

[razaadeel]

Does any one found the solution? I am not using debugger but still got the same problem. I've tried every solution that are mentioned above but problem remains same.

[haivato]

I have face this issue. And my solution is, My old flow is Home >>> Register, i will change Home >>> Account, this time my code will be updated. And I change flow as previous, then Updating Modified Coding is work

[jbarnickol]

guys, somebody found the solution ! :D

I can confirm that this worked for me using both the Chrome console and the react-native-debugger :)

This worked for me after trying many other things. I simply needed to check the box in Chrome dev tools > Network > Disable cache

[adamgins]

@jbarnickol thanks - that worked! https://github.com/jhen0409/react-native-debugger/issues/423#issuecomment-564485919

[fo-fo]

Was experiencing the same issue. Thanks for the "Disable cache" workaround – it works!

Has something changed in Metro that causes the browser to think it can cache the bundle file? Would be nice to see a proper fix for this.

[label-actions[bot]]

:warning:	Missing Reproducible Example
:information_source:	It looks like your issue is missing a reproducible example. Please provide a Snack or a repository that demonstrates the issue you are reporting in a minimal, complete, and reproducible manner.

[viz21]

For me changing Debug server host & port for device in Dev settings to localhost:8081 worked

[matthiasleitner]

This is also happening for me using react-native 0.62.1, only restarting the packager allows to get changes reloaded.

[ridhoassuryadi]

solved when i tried

• rm -rf .git/index.lock
• disabled remote debugginng and enabled it again

[medmo7]

What solved it for me npx react-native-clean-project clean-project-auto
+
new metro bundle
+
running a new build react-native run-ios

After that when i save the in vsCode i can see fast refresh blue banner again

[mehmetaydar]

On Mac: Run react-native for ios then, Go to

Simulator->Hardware->Erase all content and settings

Then go to Vscode,

Run without debugging

This made hot reload working for me.

[wandhi]

In my case I try to close React Native Debuger from my chrome and I re run my project and its work for me thanks

[johhansantana]

guys, somebody found the solution ! :D

I can confirm that this worked for me using both the Chrome console and the react-native-debugger :)

so it's basically clearing the cache of the debugger tab..... who would ever expect this to be the bug lol

[conradjonp]

I've tried every solution mentioned above and nothing worked for me. Also did a nuke (deleting pods, deleting node_modules, yarn run cache clean, etc...). Disabling debug and fast refresh didn't work either. The code is still stale and I have to rebuild to get my code changes. I recently upgraded react-native on 0.61.

UPDATE:
Found out that this only happens if I modify something related to the reducer (I am using redux). UI changes works, but for reducer code modifications, I am forced to rebuild.

UPDATE 2:
For those who still can't get this to work, reinstalling your xcode, deleting all your simulators, updating your Mac OS to the latest version and reinstalling xcode fixed this for me.

[mechanizzed]

I've tried a lot of things including rm -rf .git/index.lock and now it works again, I'm not sure if that's what solved it but try it out in case it ever comes back.

It take me a lot of time to solve.
Just rm -rf .git/index.lock .

Thanks,

rm -rf .git/index.lock
works for me!

[Sbphillips19]

npx react-native-clean-project clean-project-auto

That will cause major issues to your project if you don't know what you are doing. Force updating all your module versions has major impacts.

As far as the issue, I have tried everything else mention. I am getting an has already been declared from me saving a reducer file with a statement I accidentally used twice. After removing I can't get rid of the error no matter how many times I use clean, rebuild, removing and reinstalling app, etc... I haven't touched the app for about 2 months, but had no issues 2 months abgo.

[medmo7]

npx react-native-clean-project clean-project-auto

That will cause major issues to your project if you don't know what you are doing. Force updating all your module versions has major impacts.

As far as the issue, I have tried everything else mention. I am getting an has already been declared from me saving a reducer file with a statement I accidentally used twice. After removing I can't get rid of the error no matter how many times I use clean, rebuild, removing and reinstalling app, etc... I haven't touched the app for about 2 months, but had no issues 2 months abgo.

npx react-native-clean-project clean-project-auto gives options; you can say yes only to caches and ios/android build clean if you want. Thanks

[huseyin39]

Closing - Opening back the Node server worked for me.

[stale[bot]]

Hey there, it looks like there has been no activity on this issue recently. Has the issue been fixed, or does it still require the community's attention? This issue may be closed if no further activity occurs. You may also label this issue as a "Discussion" or add it to the "Backlog" and I will leave it open. Thank you for your contributions.

[stale[bot]]

Closing this issue after a prolonged period of inactivity. If this issue is still present in the latest release, please feel free to create a new issue with up-to-date information.

[hassan-irshad]

guys, somebody found the solution ! :D
I can confirm that this worked for me using both the Chrome console and the react-native-debugger :)

This worked for me after trying many other things. I simply needed to check the box in Chrome dev tools > Network > Disable cache

This Worked

[filipenatanael]

I was facing this issue few minutes ago, I managed to get it work by following the instructions below

• Disable the firewall or adjust the permissions there
• Run: adb kill-server && adb start-server
• Run: adb -s YOUR_DEVICE_ID reverse tcp:8081 tcp:8081

Also, I tried rm -rf .git/index.lock but didn't help me on my especifically situation

[jbarnickol]

In case it helps someone - I've noticed if I have any javascript syntax errors, the app will launch the last working version (no new code) which can be very confusing. The errors are logged in the metro terminal session so I now watch for that when running new code.

[victormaggie]

I got the same issue, and it was so annoying. Once I disable Debug module, it works perfect for me. Just disable the debug module in the developer menu, and it will be fast reloading when you save the file.

[saksham2410]

Having the same problem on 0.63.3. Tried all the above changes

[cglacet]

Does someone know why .git/index.lock is causing this kind of issues?