Hot reloading not working

[ksoni23]

Description

After setting up new react native project, I'm not able to hot reloading. To push any code changes to simulator, I have to follow this steps:

• Terminate the metro server.
• Start the metro server again
• Run yarn react-native run-ios to deploy latest build to simulator

Version

0.67.3

Output of npx react-native info

`info Fetching system and libraries information...

System:

OS: macOS 12.2

CPU: (16) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz

Memory: 72.04 MB / 16.00 GB

Shell: 5.8 - /bin/zsh

Binaries:

Node: 16.13.1 - /var/folders/wv/hl_2xrbs0_g785yr_mvj3r_w0000gq/T/yarn--1644820056516-0.9598795301282483/node

Yarn: 1.22.17 - /var/folders/wv/hl_2xrbs0_g785yr_mvj3r_w0000gq/T/yarn--1644820056516-0.9598795301282483/yarn

npm: 8.1.2 - ~/.nvm/versions/node/v16.13.1/bin/npm

Watchman: 2022.02.07.00 - /usr/local/bin/watchman

Managers:

CocoaPods: 1.11.2 - /usr/local/lib/ruby/gems/3.0.0/bin/pod

SDKs:

iOS SDK:

  Platforms: DriverKit 21.2, iOS 15.2, macOS 12.1, tvOS 15.2, watchOS 8.3

Android SDK: Not Found

IDEs:

Android Studio: 4.1 AI-201.8743.12.41.7199119

Xcode: 13.2.1/13C100 - /usr/bin/xcodebuild

Languages:

Java: 1.8.0_312 - /usr/bin/javac

npmPackages:

@react-native-community/cli: Not Found

react: 17.0.2 => 17.0.2

react-native: 0.67.2 => 0.67.2

react-native-macos: Not Found

npmGlobalPackages:

*react-native*: Not Found

:sparkles: Done in 3.21s.`

Steps to reproduce

• Start metro server - yarn react-native start

• Open another terminal and run - yarn react-native run-ios

• iOS simulator will open and you'll see app running

• Now do any cod changes or text changes and save

• Reload the metro server by tapping "r" or reload the simultor by cmd+r or shake the iOS device from menu option and choose reload or do all three steps

• Result - Changes are not reflecting

I need to kill the metro server, then start again then need to run ios build again

Snack, code example, screenshot, or link to a repository

https://user-images.githubusercontent.com/31221440/153813534-61c1be58-4407-47b6-9a9c-576865e77c4d.mov

[unfernandito]

Hi, i'm experimenting the same behavior in my app, looks like the connection between the iOS simulator and metro tcp port broke after some minutes.

This occur from the react native 0.65 version in our case.

Reggards

[dmontecillo]

Is there any fix for this?

[mohamadmek]

Check enable fast refresh device -> shake -> enable fast refresh

[MonkeyThunk]

It was having this issue at a coffee shop, the docs pointed me to two solutions, I used my phone's hotspot.

"If you have any issues, ensure that your Mac and device are on the same network and can reach each other. Many open wireless networks with captive portals are configured to prevent devices from reaching other devices on the network. You may use your device's Personal Hotspot feature in this case. You may also share your internet (Wi-Fi/Ethernet) connection from your Mac to your device via USB and connect to the bundler through this tunnel for very high transfer speeds."

[nicolascavallin]

@ksoni23 have you tried the @mohamadmek solution?

https://github.com/facebook/react-native/issues/33102#issuecomment-1196856527

In that way, if it works, please mark the issue as solved!

[AlexNolasco]

@ksoni23 have you tried the @mohamadmek solution?

#33102 (comment)

In that way, if it works, please mark the issue as solved!

Tried that still not working

System:
    OS: macOS 12.4
    CPU: (12) x64 Intel(R) Core(TM) i9-8950HK CPU @ 2.90GHz
    Memory: 1.63 GB / 32.00 GB
    Shell: 5.8.1 - /bin/zsh
  Binaries:
    Node: 14.18.1 - ~/.nvm/versions/node/v14.18.1/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 8.12.1 - ~/.nvm/versions/node/v14.18.1/bin/npm
    Watchman: 2022.12.12.00 - /usr/local/bin/watchman
  Managers:
    CocoaPods: 1.11.3 - /usr/local/bin/pod
  SDKs:
    iOS SDK:
      Platforms: DriverKit 21.4, iOS 15.5, macOS 12.3, tvOS 15.4, watchOS 8.5
    Android SDK: Not Found
  IDEs:
    Android Studio: 2021.3 AI-213.7172.25.2113.9123335
    Xcode: 13.4.1/13F100 - /usr/bin/xcodebuild
  Languages:
    Java: 11.0.16.1 - /usr/bin/javac
  npmPackages:
    @react-native-community/cli: Not Found
    react: 18.1.0 => 18.1.0 
    react-native: 0.70.6 => 0.70.6 
    react-native-macos: Not Found
  npmGlobalPackages:
    *react-native*: Not Found

[Hassaan68]

@AlexNolasco any solution? I am facing the same issue, Live reload or Fast refresh options are not showing in developer menu in real device

[7685]

same issue.

[MonkeyThunk]

This can happen also if your device and computer on not on the same wifi network.

On Mar 25, 2023, at 8:06 AM, 7685 @.***> wrote:

same issue.

— Reply to this email directly, view it on GitHub https://github.com/facebook/react-native/issues/33102#issuecomment-1483846515, or unsubscribe https://github.com/notifications/unsubscribe-auth/ABKGJS4FIZMZMSXFV5Y23VTW54CWDANCNFSM5OKQJ2SQ. You are receiving this because you commented.

[7685]

They are on the same network. I tried hotspot too.

On Sun, Mar 26, 2023 at 11:08 AM Sean Allen @.***> wrote:

This can happen also if your device and computer on not on the same wifi network.

On Mar 25, 2023, at 8:06 AM, 7685 @.***> wrote:

same issue.

— Reply to this email directly, view it on GitHub < https://github.com/facebook/react-native/issues/33102#issuecomment-1483846515>, or unsubscribe < https://github.com/notifications/unsubscribe-auth/ABKGJS4FIZMZMSXFV5Y23VTW54CWDANCNFSM5OKQJ2SQ . You are receiving this because you commented.

— Reply to this email directly, view it on GitHub https://github.com/facebook/react-native/issues/33102#issuecomment-1484125458, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAN4RXTVVRHOW3LBQMZFLFLW6BLYJANCNFSM5OKQJ2SQ . You are receiving this because you commented.Message ID: @.***>

[Akifcan]

I imported DeviceEventEmitter from react-native and this is happened

[ChampiMagic]

same issue here

[ombogdanJoinToIt]

same with react native prebuild, expo router, and expo 49

[uhhhsoyan]

It was having this issue at a coffee shop, the docs pointed me to two solutions, I used my phone's hotspot.

"If you have any issues, ensure that your Mac and device are on the same network and can reach each other. Many open wireless networks with captive portals are configured to prevent devices from reaching other devices on the network. You may use your device's Personal Hotspot feature in this case. You may also share your internet (Wi-Fi/Ethernet) connection from your Mac to your device via USB and connect to the bundler through this tunnel for very high transfer speeds."

Similarly I only experience this issue when working at WeWork locations and trying to hot reload on my physical iPhone device. Everything works fine on my home network, so I'm guessing it's related to your point about captive portals. Been battling this for a couple years now.

[cmchandan-CM]

rm -rf .git/index.lock Worked for me

[adam-kuhn]

Same on 0.72.4. I tried downgraded to 0.61 as this supposedly fixed HMR with functional components. Doing this though resulted in other expo errors. Instead of trying to resolve thoughs, I'll just live with manually refreshing the app. https://github.com/facebook/react-native/issues/10991#issuecomment-506881184

[jgudo]

rm -rf .git/index.lock worked for me too.

[ShiJianwen]

same issue

[NKANGIJAFARI]

Am facing the same issue and seems to be project specific as other projects works fine.

[deleonjulio]

same issue here

[JohnGoodman]

when I upgraded to react native 0.72.7 hot code reload stopped working. I'm using the simulator so there's no wifi issues.

[avinash-capsitech]

same issue

[rsereir]

same issue for me with react native 0.73.2

[claired4l]

This solved it for me: https://stackoverflow.com/a/57586407/20992086 or similar https://stackoverflow.com/a/71219659/20992086.

[avinash-capsitech]

This solved it for me: https://stackoverflow.com/a/57586407/20992086 or similar https://stackoverflow.com/a/71219659/20992086. Android working fine, Getting issue in iOS app, App launch successfully but changes are not reflect.

[thefranfran]

same issue for me with react native 0.73.2

[AleksaRadovanovic]

Xcode Product => Scheme => Edit Scheme => Debug

[blakef]

Reading through the issues, they're a host of development environment specific problems.

[4sskick]

I did manage uncheck the JS minify on dev menu > Setting > performance: JS minify 🔳 Do reload on Dev Menu, when do change then save, will trigger hot reload again