8/11/2023 0 Comments Webstorm debug webpackIf you have already started the bundler from outside WebStorm, for example, from the command line, you can re-use it without stopping and restarting. Optionally, type the environment variables for react-native run-android or react-native run-ios.īy default, WebStorm starts the React Native bundler automatically when you invoke the run/debug configuration. Specify the path to react-native-cli and the working directory of the application. This can be a local Node.js interpreter or a Node.js on Windows Subsystem for Linux. In the Bundler port field, specify the port on which the React Native bundler runs, by default 8081 is chosen, learn more from the React Native official website.Ĭhoose the Node.js interpreter to use. See Debugging a React Native application that uses Expo for details. This connection may fail because WebStorm by default uses localhost to start debugging while Expo expects 127.0.0.1 or an external IP address depending on what is selected in Connection field of the Metro bundler configuration. If you are using Expo, change the default bundler host to ensure successful connection with the debugger. In the Bundler host field, specify the host where the React Native bundler runs, the default value is localhost. Optionally, type the arguments to be passed to React Native, for example, specify the simulator type through the ‑‑simulator flag: ‑‑simulator="iPhone 4s". Depending on your choice, WebStorm will run the bundler with react-native run-ios or with react-native run-android. If you selected the Build and launch checkbox, choose the target platform, Android or iOS. If your application uses Expo, clear the checkbox because this bundler takes care of the process itself. Select the Build and launch checkbox if you are launching your application for the first time or if you have updated its native code since the last run. The Run/Debug Configuration: React Native opens.Ĭhoose whether you want WebStorm to build and launch the application for you: On the main menu, go to Run | Edit Configurations, click and select React Native from the list. These instructions were all that I required: I just setup Webstorm v2020.2 yesterday to debug my Expo application and it is working as expected. Try changing the Bundler host to 127.0.0.1 and try again. Looks like there's been an update to how you can setup Configurations since you tried. React-native -v: react-native-cli: 2.0.1, react-native: 0.57.1Īny help will be greatly appreciated! Thanks in advance! Maybe someone here has an idea where the problem lies? This is my first time working with javascript, react native, expo, so I am not sure, but it should be possible to debug in WebStorm directly, right? As mentioned, in Visual Studio Code everything including debugging works fine, so I don't think it's anything in the code. Either way will make the app start again on my device. I either have to stop and restart within WebStorm or I have to close the expo app and re-open it. ms"Īs usual, but the device, again, shows the red screen with aforementioned messages, or doesn't show anything but the regular white screen with a message at the bottom saying "Downlading JavaScript bundle 100,00%". "Building JavaScript bundle: finished in. The bundler doesn't say anything more than the message above.Īs soon as I turn off remote debugging, the the bundler starts building again and finishes with Timeout while connecting to remote debugger Starting custom debugger by executing: : Īnd never goes on to build the JS bundle.Īfter a short while, a red screen appears on the device, and it says: When I click "run" or "debug" and "Debug JS Remotely" is turned off, the bundler builds a JS bundle and the app starts on my devices.īut once I turn on "Debug JS Remotely", the bundler only says: I set up the configuration according to the info on this site: I have a react native app that I can successfully run using expo. I can't debug my react native / expo app in WebStorm, but I can in Visual Studio Code.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |