When I press “j” the DevTools shows up and there is no error/warning massages. But also there are no consol.logs from my app, no request logs in network tab etc.
After app reloading I get modal inside DevTools with:
“Debugging connection was closed. Reason: WebSocket disconnected. Reconnect when ready by reopening DevTools.”
Pressing reconnect doesn’t work. I have to close it and reopen again with “j” and with no effect (no more modal with error but also its still not working). Sometimes, usually with first try, I can see my project files inside :8081, but event then its not showing logs.
I noticed consol logs are working only when I change something in code, without pressing “R” to reoload. Also there are no network logs from request (same, when I bind it to onPress with button, I get it. But not when using useEffect). Its like not listening from the start. Similar on real device and emulator on android. On iOS it looks like its working.
Normally I’m using Flipper in most of my projects and there I can see my logs and network, but I would like to try something fresh. Im working on MacOS 13.2.1 M1
"dependencies": {
"expo": "~49.0.13",
"expo-status-bar": "~1.6.0",
"react": "18.2.0",
"react-native": "0.72.5"
},
Here is my simple app to check if debugger works:
import { useEffect, useState } from "react"
import { StyleSheet, Text, View } from "react-native"
export default function App() {
const [user, setUser] = useState("")
console.log("App")
useEffect(() => {
console.log("useEffect")
const apiUrl = "https://jsonplaceholder.typicode.com/users"
async function fetchData() {
try {
console.log("Start fetching")
const response = await fetch(apiUrl)
const data = await response.json()
const userName = data[0]?.username
if (userName) {
setUser(userName)
}
console.log("Data from the API:", data[0].username)
} catch (error) {
console.error("Error fetching data:", error)
}
}
// Calling the fetchData function
fetchData()
}, [])
return (
<View style={styles.container}>
<Text>`Fetched user: {user}`</Text>
</View>
)
}
const styles = StyleSheet.create({
container: {
flex: 1,
alignItems: "center",
justifyContent: "center",
},
})
Any idea what is wrong? Maybe its somthing with ports? I have no idea how to debug this.
Inside chrome://inspect/#devices i can see my device connected (just listed below).
I’ve also tried adb reverse tcp:8081 tcp:8081.
