2/29/2024 0 Comments Webstorm react debug![]() It would have been good if I could skip steps 1 and 2 for debugging expo projects, but as of WebStorm 2020.2 this is not possible. no need of steps 1 and 2 for non-expo projects. However, if I debug a normal non-expo react-native project in WebStorm, then a break point in WebStorm will be hit without having to set break point in debugger's chrome instance dev tools i.e. These settings are also applied during refactoring. WebStorm automatically formats all the new code according to the code style settings that are specific to each language. Also, at the same time in WebStorm the same break point as in chrome dev tools will be hit, and from this point onward developer can either debug in chrome dev tools or in WebStorm. For examples, refer to Debugging React Applications and Debugging Angular Applications for examples. When expo app reloads in android emulator, then automatically the code will break at break points set in step (2) above. (3) Click on Reload button in debugger's chrome instance (2) Set one or more break points in App.js and/or custom components (this must be done in chrome dev tools instance that was opened in step 1 and NOT in your cod editor/IDE) (1) Open Dev Tools in debugger's chrome instance ![]() ![]() For expo project debugging to work in WebStorm, the following steps needs to be done. So, I am using WebStorm to develop an React app with webpack, usually I just run webpack-dev-server in the console, the server is at port 8081 and I open the browser, visit localhost:8081//build and all works with hot reload. React Native Debugger is a free and opensource standalone app based on official debugger of React Native, and includes React Inspector / Redux DevTools, allow you to debug your React Native app without using WebStorm or IDEA Ultimate. There are some important points to note when debugging expo project in WebStorm. The image below illustrates module resolution in a project where react-color is an alias for the path './src/index.js'. Optional: Download and install React Native Debugger. I was able to finally debug an expo react-native project in WebStorm.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |