Skip to content

Commit 0c9dba4

Browse files
hramosFacebook Github Bot 3
authored andcommitted
Move everything out of Known Issues and into more appropriate locations.
Summary: Two of the known issues have been moved to the issue tracker: * #8315 * #8316 Others have been moved into more appropriate locations, such as the `TextInput` issue to the API doc itself, and the React debugging issue to the Debugging doc. The Android-specific compatibility concerns have been dropped entirely as it does not seem like people would find these in the docs. Closes #8321 Differential Revision: D3477999 Pulled By: JoelMarcey fbshipit-source-id: dfffc9910ebf5514eb14c6aa8a9a3e70761db874
1 parent 8e9e489 commit 0c9dba4

File tree

7 files changed

+49
-118
lines changed

7 files changed

+49
-118
lines changed

Libraries/Components/TextInput/TextInput.js

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -81,6 +81,14 @@ type Event = Object;
8181
* <TextInput {...props} />
8282
* </View>
8383
* ```
84+
*
85+
* `TextInput` has by default a border at the bottom of its view. This border
86+
* has its padding set by the background image provided by the system, and it
87+
* cannot be changed. Solutions to avoid this is to either not set height
88+
* explicitly, case in which the system will take care of displaying the border
89+
* in the correct position, or to not display the border by setting
90+
* `underlineColorAndroid` to transparent.
91+
*
8492
*/
8593
var TextInput = React.createClass({
8694
statics: {

docs/Debugging.md

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -66,6 +66,8 @@ To debug the JavaScript code in Chrome, select `Debug JS Remotely` from the Deve
6666

6767
In Chrome, press `Command⌘ + 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.
6868

69+
> It is [currently not possible](https://github.com/facebook/react-devtools/issues/229) to use the "React" tab in the Chrome Developer Tools to inspect app widgets. You can use Nuclide's "React Native Inspector" as a workaround.
70+
6971
### Debugging on a device with Chrome Developer Tools
7072

7173
On iOS devices, open the file [`RCTWebSocketExecutor.m`](https://github.com/facebook/react-native/blob/master/Libraries/WebSocket/RCTWebSocketExecutor.m) and change `localhost` to the IP address of your computer, then select `Debug JS Remotely` from the Developer Menu.
@@ -78,6 +80,7 @@ Alternatively, select `Dev Settings` from the Developer Menu, then update the `D
7880

7981
> If you run into any issues, it may be possible that one of your Chrome extensions is interacting in unexpected ways with the debugger. Try disabling all of your extensions and re-enabling them one-by-one until you find the problematic extension.
8082
83+
8184
### Debugging using a custom JavaScript debugger
8285

8386
To use a custom JavaScript debugger in place of Chrome Developer Tools, set the `REACT_DEBUGGER` environment variable to a command that will start your custom debugger. You can then select `Debug JS Remotely` from the Developer Menu to start debugging.

docs/KnownIssues.md

Lines changed: 0 additions & 90 deletions
This file was deleted.

docs/NavigatorComparison.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ title: Navigator Comparison
44
layout: docs
55
category: Guides
66
permalink: docs/navigator-comparison.html
7-
next: known-issues
7+
next: performance
88
---
99

1010
The differences between [Navigator](docs/navigator.html)

docs/PlatformSpecificInformation.md

Lines changed: 5 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -11,16 +11,14 @@ When building a cross-platform app, you'll want to re-use as much code as possib
1111

1212
React Native provides two ways to easily organize your code and separate it by platform:
1313

14-
* Using the `Platform` module.
15-
* Using platform-specific file extensions.
14+
* Using the [`Platform` module](#platform-module).
15+
* Using [platform-specific file extensions](#platform-specific-extensions).
1616

17-
```javascript
18-
import BigButton from './components/BigButton';
19-
```
17+
Certain components may have properties that work on one platform only. All of these props are annotated with `@platform` and have a small badge next to them on the website.
2018

21-
React Native will import the correct component for the running platform.
2219

2320
## Platform module
21+
2422
React Native provides a module that detects the platform in which the app is running. You can use the detection logic to implement platform-specific code. Use this option when only small parts of a component are platform-specific.
2523

2624
```javascript
@@ -79,6 +77,7 @@ if(Platform.Version === 21){
7977
```
8078

8179
## Platform-specific extensions
80+
8281
When your platform-specific code is more complex, you should consider splitting the code out into separate files. React Native will detect when a file has a `.ios.` or `.android.` extension and load the relevant platform file when required from other components.
8382

8483
For example, say you have the following files in your project:

docs/RunningOnDeviceIOS.md

Lines changed: 24 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -7,38 +7,41 @@ permalink: docs/running-on-device-ios.html
77
next: running-on-simulator-ios
88
---
99

10-
Note that running on device requires [Apple Developer account](https://developer.apple.com/register) and provisioning your iPhone. This guide covers only React Native specific topic.
10+
Running an iOS app on a device requires an [Apple Developer account](https://developer.apple.com/) and provisioning your iPhone. This guide covers only React Native specific topics.
1111

12-
## Accessing development server from device
12+
## Accessing the development server from device
1313

14-
You can iterate quickly on device using development server. Ensure that you are on the same WiFi network as your computer.
14+
You can iterate quickly on device using the development server. First, ensure that you are on the same Wi-Fi network as your computer.
1515

16-
1. Open `AwesomeApp/ios/AwesomeApp/AppDelegate.m`
17-
2. Change the IP in the URL from `localhost` to your laptop's IP. On Mac, you can find the IP address in System Preferences / Network.
18-
3. Temporarily disable App Transport Security (ATS) by [adding the `NSAllowsArbitraryLoads` entry to your `Info.plist` file][gpl]. Since ATS does not allow insecure HTTP requests to IP addresses, you must completely disable it to run on a device. This is only a requirement for development on a device, and unless you can't workaround an issue you should leave ATS enabled for production builds. For more information, see [this post on configuring ATS][bats].
19-
4. In Xcode select your phone as build target and press "Build and run"
20-
21-
[gpl]: https://gist.github.com/andrewsardone/91797ff9923b9ac6ea64
22-
[bats]: http://ste.vn/2015/06/10/configuring-app-transport-security-ios-9-osx-10-11/
16+
1. Open `ios/YourApp/AppDelegate.m`
17+
2. Change the host in the URL from `localhost` to your laptop's IP address. On Mac, you can find the IP address in System Preferences / Network.
18+
3. In Xcode, select your phone as build target and press "Build and run"
2319

2420
> Hint
2521
>
26-
> Shake the device to open development menu (reload, debug, etc.)
22+
> Shake the device to open the [developer menu](/docs/debugging.html#accessing-the-in-app-developer-menu).
23+
24+
## Building your app for production
25+
26+
You have built a great app using React Native, and you are now itching to release it in the App Store. The process is the same as any other native iOS app, with some additional considerations to take into account.
27+
28+
### Disabling the developer menu
29+
30+
Building an app for distribution in the App Store requires using the `Release` scheme in Xcode. Apps built for `Release` will automatically disable the in-app developer menu. This will prevent your users from inadvertently accessing the menu in production.
2731

28-
## Using offline bundle
32+
### Using the offline bundle
2933

30-
When you run your app on device, we pack all the JavaScript code and the images used into the app's resources. This way you can test it without development server running and submit the app to the AppStore.
34+
Set up your app to load your JavaScript, images, and other static assets from its resource bundle rather than the development server. This way you can test the app independently of the development server, and will allow you to distribute the app to beta testers and submit the app to the App Store.
3135

32-
1. Open `AwesomeApp/ios/AwesomeApp/AppDelegate.m`
33-
2. Uncomment `jsCodeLocation = [[NSBundle mainBundle] ...`
34-
3. The JS bundle will be built for dev or prod depending on your app's scheme (Debug = development build with warnings, Release = minified prod build with perf optimizations). To change the scheme navigate to `Product > Scheme > Edit Scheme...` in xcode and change `Build Configuration` between `Debug` and `Release`.
36+
1. Open `ios/YourApp/AppDelegate.m`
37+
2. Uncomment the line, `jsCodeLocation = [[NSBundle mainBundle] ...`
3538

36-
## Disabling in-app developer menu
39+
### App Transport Security
3740

38-
When building your app for production, your app's scheme should be set to `Release` as detailed in [the debugging documentation](docs/debugging.html#debugging-react-native-apps) in order to disable the in-app developer menu.
41+
App Transport Security is a security feature, added in iOS 9, that rejects all HTTP requests that are not sent over HTTPS. This can result in HTTP traffic being blocked, including the developer React Native server.
3942

40-
## Troubleshooting
43+
ATS is disabled by default in projects generated using the React Native CLI in order to make development easier. You should re-enable ATS prior to building your app for production by removing the `NSAllowsArbitraryLoads` entry from your `Info.plist` file in the `ios/` folder.
4144

42-
If `curl` command fails make sure the packager is running. Also try adding `--ipv4` flag to the end of it.
45+
To learn more about how to configure ATS on your own Xcode projects, see [this post on ATS][cats].
4346

44-
Note that since [v0.14](https://github.com/facebook/react-native/releases/tag/0.14.0) JS and images are automatically packaged into the iOS app using `Bundle React Native code and images` Xcode build phase.
47+
[cats]: http://ste.vn/2015/06/10/configuring-app-transport-security-ios-9-osx-10-11/

docs/Troubleshooting.md

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -87,3 +87,11 @@ Execution failed for task ':app:installDebug'.
8787
```
8888

8989
Try [downgrading your Gradle version to 1.2.3](https://github.com/facebook/react-native/issues/2720) in `android/build.gradle`.
90+
91+
## react-native init hangs
92+
93+
If you run into issues where running `react-native init` hangs in your system, try running it again in verbose mode and refering to [#2797](https://github.com/facebook/react-native/issues/2797) for common causes:
94+
95+
```
96+
react-native init --verbose
97+
```

0 commit comments

Comments
 (0)