You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: docs/Debugging.md
+18-15Lines changed: 18 additions & 15 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -8,24 +8,27 @@ next: testing
8
8
---
9
9
10
10
## Debugging React Native Apps
11
-
To debug the javascript code of your react app do the following:
12
-
13
-
1. Run your application in the iOS simulator.
14
-
2. Press ```Command + D``` and a webpage should open up at [http://localhost:8081/debugger-ui](http://localhost:8081/debugger-ui). (Chrome only for now)
15
-
3. Enable [Pause On Caught Exceptions](http://stackoverflow.com/questions/2233339/javascript-is-there-a-way-to-get-chrome-to-break-on-all-errors/17324511#17324511) for a better debugging experience.
16
-
4. Press ```Command + Option + I``` to open the Chrome Developer tools, or open it via ```View``` -> ```Developer``` -> ```Developer Tools```.
17
-
5. You should now be able to debug as you normally would.
11
+
To access the in-app developer menu, shake the iOS device or press `control + ⌘ + z` in the simulator.
18
12
19
13
> Hint
20
14
>
21
-
> To debug on a real device: Open the file ```RCTWebSocketExecutor.m``` and change ```localhost``` to the IP address of your computer. Shake the device to open the development menu with the option to start debugging.
15
+
> To disable the developer menu for production builds, open your project in Xcode and select `Product` → `Scheme` → `Edit Scheme...` (or press `⌘ + <`). Next, select `Run` from the menu on the left and change the Build Configuration to `Release`.
16
+
17
+
### Reload
18
+
Selecting `Reload` or pressing `⌘ + r` in the simulator will reload the JavaScript that powers your application. If you have added new resources (such as an image to `Images.xcassets`) or modified any Objective-C/Swift code, you will need to re-build from Xcode for the changes to take effect (you can do this with `⌘ + r` in Xcode).
19
+
20
+
### Chrome Developer Tools
21
+
To debug the JavaScript code in Chrome, select `Debug in Chrome` from the developer menu. This will open a new tab at [http://localhost:8081/debugger-ui](http://localhost:8081/debugger-ui).
22
+
23
+
Press `⌘ + option + i` or select `View` → `Developer` → `Developer Tools` to toggle the developer tools console. Enable [Pause On Caught Exceptions](http://stackoverflow.com/questions/2233339/javascript-is-there-a-way-to-get-chrome-to-break-on-all-errors/17324511#17324511) for a better debugging experience.
24
+
25
+
To debug on a real device: Open the file `RCTWebSocketExecutor.m` and change `localhost` to the IP address of your computer. Shake the device to open the development menu with the option to start debugging.
22
26
23
-
###Optional
24
-
Install the [React Developer Tools](https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi?hl=en) extension for Google Chrome. This will allow you to navigate the view hierarchy if you select the ```React``` tab when the developer tools are open.
27
+
#### React Developer Tools (optional)
28
+
Install the [React Developer Tools](https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi?hl=en) extension for Google Chrome. This will allow you to navigate the component hierarchy via the `React` in the developer tools (see [facebook/react-devtools](https://github.com/facebook/react-devtools) for more information).
25
29
26
-
## Live Reload
27
-
To activate Live Reload do the following:
30
+
###Live Reload
31
+
Select `Enable Live Reload` via the developer menu to have the application automatically reload when changes are made to the JavaScript.
28
32
29
-
1. Run your application in the iOS simulator.
30
-
2. Press ```Control + Command + Z```.
31
-
3. You will now see the `Enable/Disable Live Reload`, `Reload` and `Enable/Disable Debugging` options.
33
+
### FPS (Frames per Second) Monitor
34
+
On `0.5.0-rc` and higher versions, you can enable a FPS graph overlay in the developers menu in order to help you debug performance problems.
Copy file name to clipboardExpand all lines: docs/RunningOnDevice.md
+4Lines changed: 4 additions & 0 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -35,6 +35,10 @@ The bundle script supports a couple of flags:
35
35
*`--dev` - sets the value of `__DEV__` variable to true. When `true` it turns on a bunch of useful development warnings. For production it is recommended to set `__DEV__=false`.
36
36
*`--minify` - pipe the JS code through UglifyJS.
37
37
38
+
## Disabling in-app developer menu
39
+
40
+
When building your app for production, your app's scheme should be set to `Release` as detailed in [the debugging documentation](/react-native/docs/debugging.html#debugging-react-native-apps) in order to disable the in-app developer menu.
41
+
38
42
## Troubleshooting
39
43
40
44
If `curl` command fails make sure the packager is running. Also try adding `--ipv4` flag to the end of it.
0 commit comments