mirror of
https://github.com/facebook/react-native.git
synced 2025-11-01 09:14:26 +00:00
Website Deployment Script
44 lines
22 KiB
HTML
44 lines
22 KiB
HTML
<!DOCTYPE html><html><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"><title>Generating Signed APK – React Native | A framework for building native apps using React</title><meta name="viewport" content="width=device-width"><meta property="og:title" content="Generating Signed APK – 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"><base href="/react-native/"><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"><link rel="shortcut icon" href="img/favicon.png?2"><link rel="stylesheet" href="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=""><img src="img/header_logo.png">React Native</a><a class="nav-version" href="/react-native/versions.html">0.24</a><div class="nav-site-wrapper"><ul class="nav-site nav-site-internal"><li><a href="docs/getting-started.html" class="active">Docs</a></li><li><a href="support.html" class="">Support</a></li><li><a href="showcase.html" class="">Showcase</a></li><li><a href="blog/" class="">Blog</a></li></ul><div class="algolia-search-wrapper"><input id="algolia-doc-search" type="text" placeholder="Search docs..."></div><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="docs/getting-started.html#content">Getting Started</a></li><li><a style="margin-left:0;" class="" href="docs/getting-started-linux.html#content">Getting Started on Linux</a></li><li><a style="margin-left:0;" class="" href="docs/android-setup.html#content">Android Setup</a></li><li><a style="margin-left:0;" class="" href="docs/linux-windows-support.html#content">Linux and Windows Support</a></li><li><a style="margin-left:0;" class="" href="docs/tutorial.html#content">Tutorial</a></li></ul></div><div class="nav-docs-section"><h3>Community Resources</h3><ul><li><a style="margin-left:0;" class="" href="docs/videos.html#content">Videos</a></li><li><a target="_blank" style="margin-left:0;" class="" href="http://reactnative.cc/">Newsletter</a></li></ul></div><div class="nav-docs-section"><h3>Guides</h3><ul><li><a style="margin-left:0;" class="" href="docs/style.html#content">Style</a></li><li><a style="margin-left:0;" class="" href="docs/images.html#content">Images</a></li><li><a style="margin-left:0;" class="" href="docs/gesture-responder-system.html#content">Gesture Responder System</a></li><li><a style="margin-left:0;" class="" href="docs/animations.html#content">Animations</a></li><li><a style="margin-left:0;" class="" href="docs/accessibility.html#content">Accessibility</a></li><li><a style="margin-left:0;" class="" href="docs/direct-manipulation.html#content">Direct Manipulation</a></li><li><a style="margin-left:0;" class="" href="docs/debugging.html#content">Debugging</a></li><li><a style="margin-left:0;" class="" href="docs/testing.html#content">Testing</a></li><li><a style="margin-left:0;" class="" href="docs/javascript-environment.html#content">JavaScript Environment</a></li><li><a style="margin-left:0;" class="" href="docs/navigator-comparison.html#content">Navigator Comparison</a></li><li><a style="margin-left:0;" class="" href="docs/known-issues.html#content">Known Issues</a></li><li><a style="margin-left:0;" class="" href="docs/performance.html#content">Performance</a></li><li><a style="margin-left:0;" class="" href="docs/upgrading.html#content">Upgrading</a></li><li><a style="margin-left:0;" class="" href="docs/platform-specific-code.html#content">Platform Specific Code</a></li></ul></div><div class="nav-docs-section"><h3>Guides (iOS)</h3><ul><li><a style="margin-left:0;" class="" href="docs/native-modules-ios.html#content">Native Modules</a></li><li><a style="margin-left:0;" class="" href="docs/native-components-ios.html#content">Native UI Components</a></li><li><a style="margin-left:0;" class="" href="docs/linking-libraries-ios.html#content">Linking Libraries</a></li><li><a style="margin-left:0;" class="" href="docs/running-on-device-ios.html#content">Running On Device</a></li><li><a style="margin-left:0;" class="" href="docs/embedded-app-ios.html#content">Integrating with Existing Apps</a></li><li><a style="margin-left:0;" class="" href="docs/communication-ios.html#content">Communication between native and React Native</a></li></ul></div><div class="nav-docs-section"><h3>Guides (Android)</h3><ul><li><a style="margin-left:0;" class="" href="docs/native-modules-android.html#content">Native Modules</a></li><li><a style="margin-left:0;" class="" href="docs/native-components-android.html#content">Native UI Components</a></li><li><a style="margin-left:0;" class="" href="docs/running-on-device-android.html#content">Running On Device</a></li><li><a style="margin-left:0;" class="" href="docs/embedded-app-android.html#content">Integrating with Existing Apps</a></li><li><a style="margin-left:0;" class="active" href="docs/signed-apk-android.html#content">Generating Signed APK</a></li><li><a style="margin-left:0;" class="" href="docs/android-ui-performance.html#content">Profiling Android UI Performance</a></li><li><a style="margin-left:0;" class="" href="docs/android-building-from-source.html#content">Building React Native from source</a></li></ul></div><div class="nav-docs-section"><h3>components</h3><ul><li><a style="margin-left:0;" class="" href="docs/activityindicatorios.html#content">ActivityIndicatorIOS</a></li><li><a style="margin-left:0;" class="" href="docs/datepickerios.html#content">DatePickerIOS</a></li><li><a style="margin-left:0;" class="" href="docs/drawerlayoutandroid.html#content">DrawerLayoutAndroid</a></li><li><a style="margin-left:0;" class="" href="docs/image.html#content">Image</a></li><li><a style="margin-left:0;" class="" href="docs/listview.html#content">ListView</a></li><li><a style="margin-left:0;" class="" href="docs/mapview.html#content">MapView</a></li><li><a style="margin-left:0;" class="" href="docs/modal.html#content">Modal</a></li><li><a style="margin-left:0;" class="" href="docs/navigator.html#content">Navigator</a></li><li><a style="margin-left:0;" class="" href="docs/navigatorios.html#content">NavigatorIOS</a></li><li><a style="margin-left:0;" class="" href="docs/pickerios.html#content">PickerIOS</a></li><li><a style="margin-left:0;" class="" href="docs/picker.html#content">Picker</a></li><li><a style="margin-left:0;" class="" href="docs/progressbarandroid.html#content">ProgressBarAndroid</a></li><li><a style="margin-left:0;" class="" href="docs/progressviewios.html#content">ProgressViewIOS</a></li><li><a style="margin-left:0;" class="" href="docs/refreshcontrol.html#content">RefreshControl</a></li><li><a style="margin-left:0;" class="" href="docs/scrollview.html#content">ScrollView</a></li><li><a style="margin-left:0;" class="" href="docs/segmentedcontrolios.html#content">SegmentedControlIOS</a></li><li><a style="margin-left:0;" class="" href="docs/slider.html#content">Slider</a></li><li><a style="margin-left:0;" class="" href="docs/sliderios.html#content">SliderIOS</a></li><li><a style="margin-left:0;" class="" href="docs/statusbar.html#content">StatusBar</a></li><li><a style="margin-left:0;" class="" href="docs/switch.html#content">Switch</a></li><li><a style="margin-left:0;" class="" href="docs/tabbarios.html#content">TabBarIOS</a></li><li><a style="margin-left:0;" class="" href="docs/tabbarios-item.html#content">TabBarIOS.Item</a></li><li><a style="margin-left:0;" class="" href="docs/text.html#content">Text</a></li><li><a style="margin-left:0;" class="" href="docs/textinput.html#content">TextInput</a></li><li><a style="margin-left:0;" class="" href="docs/toolbarandroid.html#content">ToolbarAndroid</a></li><li><a style="margin-left:0;" class="" href="docs/touchablehighlight.html#content">TouchableHighlight</a></li><li><a style="margin-left:0;" class="" href="docs/touchablenativefeedback.html#content">TouchableNativeFeedback</a></li><li><a style="margin-left:0;" class="" href="docs/touchableopacity.html#content">TouchableOpacity</a></li><li><a style="margin-left:0;" class="" href="docs/touchablewithoutfeedback.html#content">TouchableWithoutFeedback</a></li><li><a style="margin-left:0;" class="" href="docs/view.html#content">View</a></li><li><a style="margin-left:0;" class="" href="docs/viewpagerandroid.html#content">ViewPagerAndroid</a></li><li><a style="margin-left:0;" class="" href="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="docs/actionsheetios.html#content">ActionSheetIOS</a></li><li><a style="margin-left:0;" class="" href="docs/alert.html#content">Alert</a></li><li><a style="margin-left:0;" class="" href="docs/alertios.html#content">AlertIOS</a></li><li><a style="margin-left:0;" class="" href="docs/animated.html#content">Animated</a></li><li><a style="margin-left:0;" class="" href="docs/appregistry.html#content">AppRegistry</a></li><li><a style="margin-left:0;" class="" href="docs/appstateios.html#content">AppStateIOS</a></li><li><a style="margin-left:0;" class="" href="docs/appstate.html#content">AppState</a></li><li><a style="margin-left:0;" class="" href="docs/asyncstorage.html#content">AsyncStorage</a></li><li><a style="margin-left:0;" class="" href="docs/backandroid.html#content">BackAndroid</a></li><li><a style="margin-left:0;" class="" href="docs/cameraroll.html#content">CameraRoll</a></li><li><a style="margin-left:0;" class="" href="docs/clipboard.html#content">Clipboard</a></li><li><a style="margin-left:0;" class="" href="docs/datepickerandroid.html#content">DatePickerAndroid</a></li><li><a style="margin-left:0;" class="" href="docs/dimensions.html#content">Dimensions</a></li><li><a style="margin-left:0;" class="" href="docs/intentandroid.html#content">IntentAndroid</a></li><li><a style="margin-left:0;" class="" href="docs/interactionmanager.html#content">InteractionManager</a></li><li><a style="margin-left:0;" class="" href="docs/layoutanimation.html#content">LayoutAnimation</a></li><li><a style="margin-left:0;" class="" href="docs/linking.html#content">Linking</a></li><li><a style="margin-left:0;" class="" href="docs/linkingios.html#content">LinkingIOS</a></li><li><a style="margin-left:0;" class="" href="docs/nativemethodsmixin.html#content">NativeMethodsMixin</a></li><li><a style="margin-left:0;" class="" href="docs/netinfo.html#content">NetInfo</a></li><li><a style="margin-left:0;" class="" href="docs/panresponder.html#content">PanResponder</a></li><li><a style="margin-left:0;" class="" href="docs/pixelratio.html#content">PixelRatio</a></li><li><a style="margin-left:0;" class="" href="docs/pushnotificationios.html#content">PushNotificationIOS</a></li><li><a style="margin-left:0;" class="" href="docs/statusbarios.html#content">StatusBarIOS</a></li><li><a style="margin-left:0;" class="" href="docs/stylesheet.html#content">StyleSheet</a></li><li><a style="margin-left:0;" class="" href="docs/timepickerandroid.html#content">TimePickerAndroid</a></li><li><a style="margin-left:0;" class="" href="docs/toastandroid.html#content">ToastAndroid</a></li><li><a style="margin-left:0;" class="" href="docs/vibrationios.html#content">VibrationIOS</a></li><li><a style="margin-left:0;" class="" href="docs/vibration.html#content">Vibration</a></li></ul></div><div class="nav-docs-section"><h3>Polyfills</h3><ul><li><a style="margin-left:0;" class="" href="docs/flexbox.html#content">Flexbox</a></li><li><a style="margin-left:0;" class="" href="docs/shadowproptypesios.html#content">ShadowPropTypesIOS</a></li><li><a style="margin-left:0;" class="" href="docs/geolocation.html#content">Geolocation</a></li><li><a style="margin-left:0;" class="" href="docs/network.html#content">Network</a></li><li><a style="margin-left:0;" class="" href="docs/timers.html#content">Timers</a></li><li><a style="margin-left:0;" class="" href="docs/colors.html#content">Colors</a></li></ul></div></div><div class="inner-content"><a id="content"></a><table width="100%"><tbody><tr><td><h1><a class="anchor" name="generating-signed-apk"></a>Generating Signed APK <a class="hash-link" href="docs/signed-apk-android.html#generating-signed-apk">#</a></h1></td><td style="text-align:right;"><a target="_blank" href="https://github.com/facebook/react-native/blob/master/docs/SignedAPKAndroid.md">Edit on GitHub</a></td></tr></tbody></table><div><p>To distribute your Android application via <a href="https://play.google.com/store" target="_blank">Google Play store</a>, you'll need to generate a signed release APK. The <a href="https://developer.android.com/tools/publishing/app-signing.html" target="_blank">Signing Your Applications</a> page on Android Developers documentation describes the topic in detail. This guide covers the process in brief, as well as lists the steps required to packaging the JavaScript bundle.</p><h3><a class="anchor" name="generating-a-signing-key"></a>Generating a signing key <a class="hash-link" href="docs/signed-apk-android.html#generating-a-signing-key">#</a></h3><p>You can generate a private signing key using <code>keytool</code>.</p><div class="prism language-javascript">$ keytool <span class="token operator">-</span>genkey <span class="token operator">-</span>v <span class="token operator">-</span>keystore my<span class="token operator">-</span>release<span class="token operator">-</span>key<span class="token punctuation">.</span>keystore <span class="token operator">-</span>alias my<span class="token operator">-</span>key<span class="token operator">-</span>alias <span class="token operator">-</span>keyalg RSA <span class="token operator">-</span>keysize <span class="token number">2048</span> <span class="token operator">-</span>validity <span class="token number">10000</span></div><p>This command prompts you for passwords for the keystore and key, and to provide the Distinguished Name fields for your key. It then generates the keystore as a file called <code>my-release-key.keystore</code>.</p><p>The keystore contains a single key, valid for 10000 days. The alias is a name that you will use later when signing your app, so remember to take note of the alias.</p><p><em>Note: Remember to keep your keystore file private and never commit it to version control.</em></p><h3><a class="anchor" name="setting-up-gradle-variables"></a>Setting up gradle variables <a class="hash-link" href="docs/signed-apk-android.html#setting-up-gradle-variables">#</a></h3><ol><li>Place the <code>my-release-key.keystore</code> file under the <code>android/app</code> directory in your project folder.</li><li>Edit the file <code>~/.gradle/gradle.properties</code> and add the following (replace <code>*****</code> with the correct keystore password, alias and key password),</li></ol><div class="prism language-javascript">MYAPP_RELEASE_STORE_FILE<span class="token operator">=</span>my<span class="token operator">-</span>release<span class="token operator">-</span>key<span class="token punctuation">.</span>keystore
|
||
MYAPP_RELEASE_KEY_ALIAS<span class="token operator">=</span>my<span class="token operator">-</span>key<span class="token operator">-</span>alias
|
||
MYAPP_RELEASE_STORE_PASSWORD<span class="token operator">=</span><span class="token operator">*</span><span class="token operator">*</span><span class="token operator">*</span><span class="token operator">*</span><span class="token operator">*</span>
|
||
MYAPP_RELEASE_KEY_PASSWORD<span class="token operator">=</span><span class="token operator">*</span><span class="token operator">*</span><span class="token operator">*</span><span class="token operator">*</span><span class="token operator">*</span></div><p>These are going to be global gradle variables, which we can later use in our gradle config to sign our app.</p><p><em>Note: Once you publish the app on the Play Store, you will need to republish your app under a different package name (losing all downloads and ratings) if you want to change the signing key at any point. So backup your keystore and don't forget the passwords.</em></p><h3><a class="anchor" name="adding-signing-config-to-your-app-s-gradle-config"></a>Adding signing config to your app's gradle config <a class="hash-link" href="docs/signed-apk-android.html#adding-signing-config-to-your-app-s-gradle-config">#</a></h3><p>Edit the file <code>android/app/build.gradle</code> in your project folder and add the signing config,</p><div class="prism language-javascript"><span class="token punctuation">.</span><span class="token punctuation">.</span><span class="token punctuation">.</span>
|
||
android <span class="token punctuation">{</span>
|
||
<span class="token punctuation">.</span><span class="token punctuation">.</span><span class="token punctuation">.</span>
|
||
defaultConfig <span class="token punctuation">{</span> <span class="token punctuation">.</span><span class="token punctuation">.</span><span class="token punctuation">.</span> <span class="token punctuation">}</span>
|
||
signingConfigs <span class="token punctuation">{</span>
|
||
release <span class="token punctuation">{</span>
|
||
storeFile <span class="token function">file<span class="token punctuation">(</span></span>MYAPP_RELEASE_STORE_FILE<span class="token punctuation">)</span>
|
||
storePassword MYAPP_RELEASE_STORE_PASSWORD
|
||
keyAlias MYAPP_RELEASE_KEY_ALIAS
|
||
keyPassword MYAPP_RELEASE_KEY_PASSWORD
|
||
<span class="token punctuation">}</span>
|
||
<span class="token punctuation">}</span>
|
||
buildTypes <span class="token punctuation">{</span>
|
||
release <span class="token punctuation">{</span>
|
||
<span class="token punctuation">.</span><span class="token punctuation">.</span><span class="token punctuation">.</span>
|
||
signingConfig signingConfigs<span class="token punctuation">.</span>release
|
||
<span class="token punctuation">}</span>
|
||
<span class="token punctuation">}</span>
|
||
<span class="token punctuation">}</span>
|
||
<span class="token punctuation">.</span><span class="token punctuation">.</span><span class="token punctuation">.</span></div><h3><a class="anchor" name="generating-the-release-apk"></a>Generating the release APK <a class="hash-link" href="docs/signed-apk-android.html#generating-the-release-apk">#</a></h3><p>Simply run the following in a terminal:</p><div class="prism language-javascript">$ cd android && <span class="token punctuation">.</span><span class="token operator">/</span>gradlew assembleRelease</div><p>Gradle's <code>assembleRelease</code> will bundle all the JavaScript needed to run your app into the APK. If you need to change the way the JavaScript bundle and/or drawable resources are bundled (e.g. if you changed the default file/folder names or the general structure of the project), have a look at <code>android/app/build.gradle</code> to see how you can update it to reflect these changes.</p><p>The generated APK can be found under <code>android/app/build/outputs/apk/app-release.apk</code>, and is ready to be distributed.</p><h3><a class="anchor" name="testing-the-release-build-of-your-app"></a>Testing the release build of your app <a class="hash-link" href="docs/signed-apk-android.html#testing-the-release-build-of-your-app">#</a></h3><p>Before uploading the release build to the Play Store, make sure you test it thoroughly. Install it on the device using:</p><div class="prism language-javascript">$ cd android && <span class="token punctuation">.</span><span class="token operator">/</span>gradlew installRelease</div><p>Note that <code>installRelease</code> is only available if you've set up signing as described above.</p><p>You can kill any running packager instances, all your and framework JavaScript code is bundled in the APK's assets.</p><h3><a class="anchor" name="enabling-proguard-to-reduce-the-size-of-the-apk-optional"></a>Enabling Proguard to reduce the size of the APK (optional) <a class="hash-link" href="docs/signed-apk-android.html#enabling-proguard-to-reduce-the-size-of-the-apk-optional">#</a></h3><p>Proguard is a tool that can slightly reduce the size of the APK. It does this by stripping parts of the React Native Java bytecode (and its dependencies) that your app is not using.</p><p><em><strong>IMPORTANT</strong>: Make sure to thoroughly test your app if you've enabled Proguard. Proguard often requires configuration specific to each native library you're using. See <code>app/proguard-rules.pro</code>.</em></p><p>To enable Proguard, edit <code>android/app/build.gradle</code>:</p><div class="prism language-javascript"><span class="token comment" spellcheck="true">/**
|
||
* Run Proguard to shrink the Java bytecode in release builds.
|
||
*/</span>
|
||
def enableProguardInReleaseBuilds <span class="token operator">=</span> <span class="token boolean">true</span></div></div><div class="docs-prevnext"><a class="docs-next" href="docs/android-ui-performance.html#content">Next →</a></div></div></section><footer class="wrap"><div class="center">© 2016 Facebook Inc.</div></footer></div><div id="fb-root"></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><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");
|
||
|
||
docsearch({
|
||
apiKey: '2c98749b4a1e588efec53b2acec13025',
|
||
indexName: 'react-native-versions',
|
||
inputSelector: '#algolia-doc-search',
|
||
algoliaOptions: { facetFilters: [ "tags:0.24" ], hitsPerPage: 5 }
|
||
});
|
||
</script><script src="js/scripts.js"></script></body></html> |