mirror of
https://github.com/facebook/react-native.git
synced 2025-11-01 09:14:26 +00:00
Travis CI
26 lines
17 KiB
HTML
26 lines
17 KiB
HTML
<!DOCTYPE html><html><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"><title>React Native | A framework for building native apps using React</title><meta name="viewport" content="width=device-width"><meta property="og:title" content="React Native | A framework for building native apps using React"><meta property="og:type" content="website"><meta property="og:url" content="http://facebook.github.io/react-native/index.html"><meta property="og:image" content="http://facebook.github.io/react-native/img/opengraph.png?2"><meta property="og:description" content="A framework for building native apps using React"><link rel="shortcut icon" href="/react-native/img/favicon.png?2"><link rel="stylesheet" href="/react-native/css/react-native.css"><script type="text/javascript" src="//use.typekit.net/vqa1hcx.js"></script><script type="text/javascript">try{Typekit.load();}catch(e){}</script></head><body><div class="container"><div class="nav-main"><div class="wrap"><a class="nav-home" href="/react-native/"><img src="/react-native/img/header_logo.png">React Native</a><div class="nav-site-wrapper"><ul class="nav-site nav-site-internal"><li><a href="/react-native/docs/getting-started.html" class="active">Docs</a></li><li><a href="/react-native/support.html" class="">Support</a></li><li><a href="https://github.com/facebook/react-native/releases" class="">Releases</a></li></ul><ul class="nav-site nav-site-external"><li><a href="https://github.com/facebook/react-native" class="">GitHub</a></li><li><a href="http://facebook.github.io/react" class="">React</a></li></ul></div></div></div><section class="content wrap documentationContent"><div class="nav-docs"><div class="nav-docs-section"><h3>Quick Start</h3><ul><li><a style="margin-left:0;" class="" href="/react-native/docs/getting-started.html#content">Getting Started</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/tutorial.html#content">Tutorial</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/videos.html#content">Videos</a></li></ul></div><div class="nav-docs-section"><h3>Guides</h3><ul><li><a style="margin-left:0;" class="" href="/react-native/docs/style.html#content">Style</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/gesture-responder-system.html#content">Gesture Responder System</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/animations.html#content">Animations</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/accessibility.html#content">Accessibility</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/nativemodulesios.html#content">Native Modules (iOS)</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/nativecomponentsios.html#content">Native UI Components (iOS)</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/direct-manipulation.html#content">Direct Manipulation</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/linking-libraries.html#content">Linking Libraries</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/debugging.html#content">Debugging</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/testing.html#content">Testing</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/runningondevice.html#content">Running On Device</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/embedded-app.html#content">Integration with Existing App</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/javascript-environment.html#content">JavaScript Environment</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/navigator-comparison.html#content">Navigator Comparison</a></li></ul></div><div class="nav-docs-section"><h3>components</h3><ul><li><a style="margin-left:0;" class="" href="/react-native/docs/activityindicatorios.html#content">ActivityIndicatorIOS</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/datepickerios.html#content">DatePickerIOS</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/image.html#content">Image</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/listview.html#content">ListView</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/mapview.html#content">MapView</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/navigator.html#content">Navigator</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/navigatorios.html#content">NavigatorIOS</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/pickerios.html#content">PickerIOS</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/scrollview.html#content">ScrollView</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/segmentedcontrolios.html#content">SegmentedControlIOS</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/sliderios.html#content">SliderIOS</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/switchios.html#content">SwitchIOS</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/tabbarios.html#content">TabBarIOS</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/tabbarios-item.html#content">TabBarIOS.Item</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/text.html#content">Text</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/textinput.html#content">TextInput</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/touchablehighlight.html#content">TouchableHighlight</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/touchableopacity.html#content">TouchableOpacity</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/touchablewithoutfeedback.html#content">TouchableWithoutFeedback</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/view.html#content">View</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/webview.html#content">WebView</a></li></ul></div><div class="nav-docs-section"><h3>apis</h3><ul><li><a style="margin-left:0;" class="" href="/react-native/docs/actionsheetios.html#content">ActionSheetIOS</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/alertios.html#content">AlertIOS</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/appregistry.html#content">AppRegistry</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/appstateios.html#content">AppStateIOS</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/asyncstorage.html#content">AsyncStorage</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/cameraroll.html#content">CameraRoll</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/interactionmanager.html#content">InteractionManager</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/layoutanimation.html#content">LayoutAnimation</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/linkingios.html#content">LinkingIOS</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/netinfo.html#content">NetInfo</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/panresponder.html#content">PanResponder</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/pixelratio.html#content">PixelRatio</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/pushnotificationios.html#content">PushNotificationIOS</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/statusbarios.html#content">StatusBarIOS</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/stylesheet.html#content">StyleSheet</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/vibrationios.html#content">VibrationIOS</a></li></ul></div><div class="nav-docs-section"><h3>Polyfills</h3><ul><li><a style="margin-left:0;" class="" href="/react-native/docs/flexbox.html#content">Flexbox</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/geolocation.html#content">Geolocation</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/network.html#content">Network</a></li><li><a style="margin-left:0;" class="" href="/react-native/docs/timers.html#content">Timers</a></li></ul></div></div><div class="inner-content"><a id="content"></a><h1>Troubleshooting</h1><div><h2><a class="anchor" name="cmd-r-does-not-reload-the-simulator"></a>Cmd-R does not reload the simulator <a class="hash-link" href="#cmd-r-does-not-reload-the-simulator">#</a></h2><p>Enable iOS simulator's "Connect hardware keyboard" from menu Hardware > Keyboard menu. </p><p><img src="https://cloud.githubusercontent.com/assets/1388454/6863127/03837824-d409-11e4-9251-e05bd31d978f.png" alt="Keyboard Menu"></p><p>If you are using a non-QWERTY/AZERTY keyboard layout you can use the <code>Hardware > Shake Gesture</code> to bring up the dev menu and click "Refresh"</p><h2><a class="anchor" name="port-already-in-use-red-screen"></a>Port already in use red-screen <a class="hash-link" href="#port-already-in-use-red-screen">#</a></h2><p><img src="https://cloud.githubusercontent.com/assets/602176/6857442/63fd4f0a-d3cc-11e4-871f-875b0c784611.png" alt="red-screen"></p><p>Something is probably already running on port 8081. You can either kill it or try to change which port the packager is listening to.</p><h5><a class="anchor" name="kill-process-on-port-8081"></a>Kill process on port 8081 <a class="hash-link" href="#kill-process-on-port-8081">#</a></h5><p><code>$ sudo lsof -n -i4TCP:8081 | grep LISTEN</code></p><p>then</p><p><code>$ kill -9 <cma process id></code></p><h5><a class="anchor" name="change-the-port-in-xcode"></a>Change the port in Xcode <a class="hash-link" href="#change-the-port-in-xcode">#</a></h5><p>Edit <code>AppDelegate.m</code> to use a different port.</p><div class="prism language-javascript"> <span class="token comment" spellcheck="true"> // OPTION 1
|
|
</span> <span class="token comment" spellcheck="true"> // Load from development server. Start the server from the repository root:
|
|
</span> <span class="token comment" spellcheck="true"> //
|
|
</span> <span class="token comment" spellcheck="true"> // $ npm start
|
|
</span> <span class="token comment" spellcheck="true"> //
|
|
</span> <span class="token comment" spellcheck="true"> // To run on device, change `localhost` to the IP address of your computer, and make sure your computer and
|
|
</span> <span class="token comment" spellcheck="true"> // iOS device are on the same Wi-Fi network.
|
|
</span> jsCodeLocation <span class="token operator">=</span> <span class="token punctuation">[</span>NSURL URLWithString<span class="token punctuation">:</span>@<span class="token string">"http://localhost:9381/index.ios.bundle"</span><span class="token punctuation">]</span><span class="token punctuation">;</span></div><h2><a class="anchor" name="watchman-took-too-long-to-load"></a>Watchman took too long to load <a class="hash-link" href="#watchman-took-too-long-to-load">#</a></h2><p>Permission settings prevent Watchman from loading. A recent update solves this, get a HEAD install of Watchman if you are experiencing this error.</p><div class="prism language-javascript">brew uninstall watchman
|
|
brew install <span class="token operator">--</span>HEAD watchman</div><h2><a class="anchor" name="npm-locking-error"></a>NPM locking error <a class="hash-link" href="#npm-locking-error">#</a></h2><p>If in the <code>react-native init <project></code> phase you saw npm fail with "npm WARN locking Error: EACCES" then try the following:</p><div class="prism language-javascript">sudo chown <span class="token operator">-</span>R $USER <span class="token operator">~</span><span class="token operator">/</span><span class="token punctuation">.</span>npm
|
|
sudo chown <span class="token operator">-</span>R $USER <span class="token operator">/</span>usr<span class="token operator">/</span>local<span class="token operator">/</span>lib<span class="token operator">/</span>node_modules</div><h2><a class="anchor" name="debugging-in-chrome-hangs-and-or-does-not-work-well"></a>Debugging in Chrome hangs and/or does not work well <a class="hash-link" href="#debugging-in-chrome-hangs-and-or-does-not-work-well">#</a></h2><p>It is possible that one of your Chrome extensions is interacting in unexpected ways with the debugger. If you are having this issue, try disabling all of your extensions and re-enabling them one-by-one until you find the problematic extension.</p><h2><a class="anchor" name="xcode-build-failures"></a>Xcode Build Failures <a class="hash-link" href="#xcode-build-failures">#</a></h2><p>To see the exact error that is causing your build to fail, go into the Issues Navigator in the left sidebar.</p><h5><a class="anchor" name="react-libraries-missing"></a>React libraries missing <a class="hash-link" href="#react-libraries-missing">#</a></h5><p>If you are using CocoaPods, verify that you have added React along with the subspecs to the <code>Podfile</code>. For example, if you were using the <code><Text /></code>, <code><Image /></code> and <code>fetch()</code> APIs, you would need to add these in your <code>Podfile</code>:</p><div class="prism language-javascript">pod <span class="token string">'React'</span><span class="token punctuation">,</span> <span class="token punctuation">:</span>subspecs <span class="token operator">=</span><span class="token operator">></span> <span class="token punctuation">[</span>
|
|
<span class="token string">'RCTText'</span><span class="token punctuation">,</span>
|
|
<span class="token string">'RCTImage'</span><span class="token punctuation">,</span>
|
|
<span class="token string">'RCTNetwork'</span><span class="token punctuation">,</span>
|
|
<span class="token string">'RCTWebSocket'</span><span class="token punctuation">,</span>
|
|
<span class="token punctuation">]</span></div><p>Next, make sure you have run <code>pod install</code> and that a <code>Pods/</code> directory has been created in your project with React installed. CocoaPods will instruct you to use the generated <code>.xcworkspace</code> file henceforth to be able to use these installed dependencies.</p><p>If you are adding React manually, make sure you have included all the relevant dependencies, like <code>RCTText.xcodeproj</code>, <code>RCTImage.xcodeproj</code> depending on the ones you are using. Next, the binaries built by these dependencies have to be linked to your app binary. Use the <code>Linked Frameworks and Binaries</code> section in the Xcode project settings. More detailed steps are here: <a href="https://facebook.github.io/react-native/docs/linking-libraries.html#content" target="_blank">Linking Libraries</a>.</p><h5><a class="anchor" name="argument-list-too-long-recursive-header-expansion-failed"></a>Argument list too long: recursive header expansion failed <a class="hash-link" href="#argument-list-too-long-recursive-header-expansion-failed">#</a></h5><p>In the project's build settings, <code>User Search Header Paths</code> and <code>Header Search Paths</code> are two configs that specify where Xcode should look for <code>#import</code> header files specified in the code. For Pods, CocoaPods uses a default array of specific folders to look in. Verify that this particular config is not overwritten, and that none of the folders configured are too large. If one of the folders is a large folder, Xcode will attempt to recursively search the entire directory and throw above error at some point.</p><p>To revert the <code>User Search Header Paths</code> and <code>Header Search Paths</code> build settings to their defaults set by CocoaPods - select the entry in the Build Settings panel, and hit delete. It will remove the custom override and return to the CocoaPod defaults.</p></div><div class="docs-prevnext"></div></div></section><footer class="wrap"><div class="right">© 2015 Facebook Inc.</div></footer></div><div id="fb-root"></div><script>
|
|
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
|
|
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
|
|
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
|
|
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
|
|
ga('create', 'UA-41298772-2', 'facebook.github.io');
|
|
ga('send', 'pageview');
|
|
|
|
!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)
|
|
){js=d.createElement(s);js.id=id;js.src="https://platform.twitter.com/widgets.js";
|
|
fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");
|
|
</script></body></html> |