Doesn't work for projects built with Expo SDK 50 #240
Comments
|
Cannot get any ws target info from bundler url from expo50. |
|
Also experiencing the same issue. In fact the "Debug Remote JS" option has disappeared completely in Expo Go, it was there in SDK 49. |
|
Hi all! We had an issue in Expo Go, which we fixed 4 days ago, and released 1-2 days ago (pending store review). If you use a simulator or emulator, make sure you are using the latest Expo Go version ( If that doesn't work, do let me know! |
|
I'm also unable to use the extension on my end. The only action I see is a progress-bar-like graphic show and then hide, at the top of VS Code's If it helps, here's information about my specific scenario/environment... VS CodeSystem installed Node.js: 20.11.0 (NVM managed)Expo
Project's
|
|
Hey, Any news about this one? It seems as-if it ignores the bundlerPort in my launch.json and attempts to use port 9229. My launch.json: So I tried to run expo over port 9229: And then the VSCode Expo Tools managed to attach. |
|
Same here, I have a project with Expo SDK 49, my VS Code is v.1.86.1 and Expo Go v.2.30.9 I have tried the command Expo: Debug, and nothing appears on the screen except the "Inspect Expo App" in Call Stack under the Run and Debug section, it appears for 5 seconds and then disappears. I've tried using the port 9229 as with the users above and I get the same behavior. Would love to see a solution to this! |
|
Same here, after two days of experimenting none of the documented ways of debugging seem to work with the latest SDK version! |
|
And same here with the above launch.json from orenagiv and expo 49, VS. Code 1.86.0 and Expo Go v2.30.9. I am launching the App on Expo Go on my iPhone with iOS 17.3.1. |
|
I opened this related issue and provided a repo with my minimal example: expo/expo#27157 (comment) |
This comment was marked as off-topic.
This comment was marked as off-topic.
This comment was marked as off-topic.
This comment was marked as off-topic.
|
I've installed the Expo Tools extension in VSCODE. I can't find the "Exp: Debug ... command anywhere. What am I missing? Working on a MAC. I'm wanting to debug with breakpoints in VSCODE. |
@rsapko You need to press F1 and search for it in the dropdown box |
Yes. or Shit + Command + P, but it's not there. |
|
I don't know, the problem for me it seems that the extension is not attaching to the packager and thus, cannot debug any breakpoints either on MAC or PC (I work on both) |
Have you been able to find a setup that works with breakpoints in VSCODE? Attaching to Hermes works somewhat, but the source maps seem off and the 'watch' and 'variables' are inconsistent. Can you share a launch.json if you have it working? |
@rsapko I have the React Native Tools extension and it seems that it is currently working for me. I wanted to try out Expo Tools because it is actually faster than the other one, but it's not working for me either right now. |
@nicolasWD I have the React Native Tools Extension also. I've tried to get that to work too. Would you mind sharing your launch.json file with me. I need the configuration that works and I've tried everything. |
|
Hi I'm having the same issue. i can't connect my debugger in vs code or the breakpoints set in the chrome dev tools javascript inspector. The only way to get to code to stop is by using hardcoded I'm using expo sdk Have latest version of vscode and expo tools vs code plugin installed. The hermes expo docs says I'm successfully getting an output here, so unsure what the issue is. has anyone found a workaround? This a is a new react native project, and my productivity not using an IDE debugger is significantly lower. |
Hi, sorry for the late reply this is the object I have in my launch.json (1st entry is for React Native Tools and last for the Expo Tools extensions: {
// Use IntelliSense to learn about possible attributes.
// Hover to view descriptions of existing attributes.
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
"version": "0.2.0",
"configurations": [
{
"name": "Debug Exponent Hermes - Experimental",
"request": "launch",
"type": "reactnativedirect",
"cwd": "${workspaceFolder}",
"platform": "exponent",
"expoHostType": "lan"
},
{
"name": "Debug in Exponent",
"request": "launch",
"type": "reactnative",
"cwd": "${workspaceFolder}",
"platform": "exponent",
"expoHostType": "lan"
},
{
"name": "Debug Android",
"cwd": "${workspaceFolder}",
"type": "reactnative",
"request": "launch",
"platform": "android"
},
{
"type": "expo",
"request": "attach",
"name": "Debug Expo app",
"projectRoot": "${workspaceFolder}",
"bundlerPort": "19000",
"bundlerHost": "192.168.10.2"
}
]
} |
|
HI I've been able to get vs code debugger work for my dev client build on my simulator using. Posted abotu it in reaact native tools lib here and got the solution. Expo tools debugger still is not working, but using react native tools works. |
@alexwolf22 With Expo 50? |
|
@alexwolf22 Ah, I see...dev client build. I haven't switched from Expo Go yet. I think it's time. I'll have to figure that out now too. |
|
I am working with the default stickersmash repo just to see if it works in general, not in my projects anymore after weeks of trying to get this working. |
|
I have same problem. |
|
Hi all! Sorry for the inactivity here. We've published a new version, As a follow-up, we updated all our test fixtures to also ensure SDK 50 (and future SDK versions) are working as intended. And we will expand the existing tests, where possible. I'll keep this issue open for now, but with Note that if vscode still gives you problems, you can also use the built-in Chrome DevTools. You can open this by pressing |
@byCedric The setup instructions are a little vague. Can you give a sample launch.json or better instructions on how to set up the launch.json. Classic application? Application in direct mode(Hermes)? What configuration should we use? using it wit Dev Build? Expo Go? |
|
@rsapko Of course. Keep in mind that Expo Tools only supports debugging through Hermes, not through the "classic application" methods React Native Tools provides. In short:
An example .vscode/launch.json would look something like: {
"configurations": [
// Default settings generated from "Expo: Debug app on device or emulator"
{
"type": "expo",
"request": "attach",
"name": "Debug Expo app",
"projectRoot": "${workspaceFolder}",
"bundlerPort": "8081",
"bundlerHost": "127.0.0.1"
},
// Slightly customized version
{
"type": "expo",
"request": "attach",
// Slightly different name
"name": "Debug my-app",
// When using monorepos OR workspaces that's not the root of your Expo app,
// you have to specify the expo project path. It will ask too if it cant find it.
"projectRoot": "${workspaceFolder}/apps/my-app",
// These can be modified however you want
"bundlerPort": "8081",
// localhost or your LAN address should also work fine
"bundlerHost": "127.0.0.1",
// Enable trace logs to debug the debugger :) (it contains the CDP communications between vscode and the app)
"trace": true,
// You can disable something called "turbo source maps", it's a semi-experimental feature from vscode
// and should only be disabled if you are running into source maps or breakpoint binding issues
"enableTurboSourcemaps": false,
}
]
}Hope this helps! |
|
@byCedric Thank you. I'll give it a try. |
|
@byCedric I'm afraid it is still not working on my end.
What happens?
Until the issue is resolved I'm opting out. Thanks! |
|
@ArnieGA It sounds like you are running into source map issues, which are also preventing the debugger from binding breakpoints. Right now, Hermes doesn't support setting breakpoints by URI, so we have to fall back to source map-based bindings. This will be improved in later React Native versions. One thing you can check is why breakpoints aren't binding, vscode has a nice tool for that.
If you want, you can share a repro with the project, with comments above the breakpoint locations you are trying to bind. If you create a new issue, I'm happy to take a look and see what we can do to improve. Alternatively, as mentioned before, you can still use the Chrome DevTools which should be slightly better in terms of breakpoint binding. Keep in mind that not everything is bindable, like JSX elements in render functions. |
|
Thank you for clarifying that for me. :)
…On Fri, Mar 8, 2024, 12:03 PM Cedric van Putten ***@***.***> wrote:
@ArnieGA <https://github.com/ArnieGA> It sounds like you are running into
source map issues, which are also preventing the debugger from binding
breakpoints. Right now, Hermes doesn't support setting breakpoints by URI,
so we have to fall back to source map-based bindings. This will be improved
in later React Native versions.
If you want, you can share a repro with the project, with comments above
the breakpoint locations you are trying to bind. If you create a new issue,
I'm happy to take a look and see what we can do to improve.
Alternatively, as mentioned before, you can still use the Chrome DevTools
which should be slightly better in terms of breakpoint binding. Keep in
mind that not everything is bindable, like JSX elements in render functions.
—
Reply to this email directly, view it on GitHub
<#240 (comment)>,
or unsubscribe
<https://github.com/notifications/unsubscribe-auth/ADEPLHPHSFVZN3E6USQBMXTYXHOMPAVCNFSM6AAAAABCDU2KXCVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMYTSOBVHE2TQMZUHA>
.
You are receiving this because you were mentioned.Message ID:
***@***.***>
|
|
Hi all! A quick follow-up on this issue:
For now, I'll close (and lock) this issue. If you are having trouble with breakpoints not binding, I'd love to hear about it. As mentioned here, please open a new issue with a repro and the breakpoints you are trying to bind. I'd be more than happy to take a look and see what we can do to improve it. Also, if I'm unresponsive on GitHub that's because I have 5k+ messages. You can always reach out on Twitter to me: https://twitter.com/cedric_dev. Hope this helps! |
Description of the bug
Doesn't work for projects built with Expo SDK 50, always stuck at 'waiting for device to connect...'"
To Reproduce
Expected behavior
dialog box disappear and you can debug in debug console in vscode.
Actual behavior
always stuck at 'waiting for device to connect...'"
Additional context
It works fine with lower expo sdk version projects.
The text was updated successfully, but these errors were encountered: