Deploy website
Deploy website version based on 243035522fb4643fd16cd5ec3ed161e6fed3d9a1
|
Before Width: | Height: | Size: 20 KiB After Width: | Height: | Size: 6.6 KiB |
|
Before Width: | Height: | Size: 13 KiB After Width: | Height: | Size: 6.6 KiB |
|
Before Width: | Height: | Size: 50 KiB After Width: | Height: | Size: 15 KiB |
|
Before Width: | Height: | Size: 7.7 KiB After Width: | Height: | Size: 9.1 KiB |
|
Before Width: | Height: | Size: 121 KiB After Width: | Height: | Size: 37 KiB |
|
Before Width: | Height: | Size: 109 KiB After Width: | Height: | Size: 25 KiB |
|
Before Width: | Height: | Size: 15 KiB After Width: | Height: | Size: 18 KiB |
|
Before Width: | Height: | Size: 34 KiB After Width: | Height: | Size: 33 KiB |
|
Before Width: | Height: | Size: 310 KiB After Width: | Height: | Size: 35 KiB |
|
Before Width: | Height: | Size: 58 KiB After Width: | Height: | Size: 34 KiB |
@@ -254,7 +254,7 @@
|
||||
</blockquote>
|
||||
<p>Once setup has finalized and you're presented with the Welcome screen, proceed to the next step.</p>
|
||||
<h4><a class="anchor" aria-hidden="true" id="2-install-the-android-sdk"></a><a href="#2-install-the-android-sdk" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>2. Install the Android SDK</h4>
|
||||
<p>Android Studio installs the latest Android SDK by default. Building a React Native app with native code, however, requires the <code>Android 6.0 (Marshmallow)</code> SDK in particular. Additional Android SDKs can be installed through the SDK Manager in Android Studio.</p>
|
||||
<p>Android Studio installs the latest Android SDK by default. Building a React Native app with native code, however, requires the <code>Android 8.0 (Oreo)</code> SDK in particular. Additional Android SDKs can be installed through the SDK Manager in Android Studio.</p>
|
||||
<p>The SDK Manager can be accessed from the "Welcome to Android Studio" screen. Click on "Configure", then select "SDK Manager".</p>
|
||||
<p><block class="native mac android" /></p>
|
||||
<p><img src="/react-native/docs/assets/GettingStartedAndroidStudioWelcomeMacOS.png" alt="Android Studio Welcome"></p>
|
||||
@@ -264,11 +264,9 @@
|
||||
<blockquote>
|
||||
<p>The SDK Manager can also be found within the Android Studio "Preferences" dialog, under <strong>Appearance & Behavior</strong> → <strong>System Settings</strong> → <strong>Android SDK</strong>.</p>
|
||||
</blockquote>
|
||||
<p>Select the "SDK Platforms" tab from within the SDK Manager, then check the box next to "Show Package Details" in the bottom right corner. Look for and expand the <code>Android 6.0 (Marshmallow)</code> entry, then make sure the following items are all checked:</p>
|
||||
<p>Select the "SDK Platforms" tab from within the SDK Manager, then check the box next to "Show Package Details" in the bottom right corner. Look for and expand the <code>Android 8.0 (Oreo)</code> entry, then make sure the following items are all checked:</p>
|
||||
<ul>
|
||||
<li><code>Google APIs</code></li>
|
||||
<li><code>Android SDK Platform 23</code></li>
|
||||
<li><code>Intel x86 Atom_64 System Image</code></li>
|
||||
<li><code>Android SDK Platform 26</code></li>
|
||||
<li><code>Google APIs Intel x86 Atom_64 System Image</code></li>
|
||||
</ul>
|
||||
<p><block class="native mac android" /></p>
|
||||
@@ -276,11 +274,11 @@
|
||||
<p><block class="native windows android" /></p>
|
||||
<p><img src="/react-native/docs/assets/GettingStartedAndroidSDKManagerWindows.png" alt="Android SDK Manager"></p>
|
||||
<p><block class="native windows mac linux android" /></p>
|
||||
<p>Next, select the "SDK Tools" tab and check the box next to "Show Package Details" here as well. Look for and expand the "Android SDK Build-Tools" entry, then make sure that <code>23.0.1</code> is selected.</p>
|
||||
<p>Next, select the "SDK Tools" tab and check the box next to "Show Package Details" here as well. Look for and expand the "Android SDK Build-Tools" entry, then make sure that <code>26.0.3</code> is selected.</p>
|
||||
<p><block class="native mac android" /></p>
|
||||
<p><img src="/react-native/docs/assets/GettingStartedAndroidSDKManagerSDKToolsMacOS.png" alt="Android SDK Manager - 23.0.1 Build Tools"></p>
|
||||
<p><img src="/react-native/docs/assets/GettingStartedAndroidSDKManagerSDKToolsMacOS.png" alt="Android SDK Manager - 26.0.3 Build Tools"></p>
|
||||
<p><block class="native windows android" /></p>
|
||||
<p><img src="/react-native/docs/assets/GettingStartedAndroidSDKManagerSDKToolsWindows.png" alt="Android SDK Manager - 23.0.1 Build Tools"></p>
|
||||
<p><img src="/react-native/docs/assets/GettingStartedAndroidSDKManagerSDKToolsWindows.png" alt="Android SDK Manager - 26.0.3 Build Tools"></p>
|
||||
<p><block class="native windows mac linux android" /></p>
|
||||
<p>Finally, click "Apply" to download and install the Android SDK and related build tools.</p>
|
||||
<p><block class="native mac android" /></p>
|
||||
@@ -353,7 +351,7 @@
|
||||
<p><block class="native mac android" /></p>
|
||||
<p><img src="/react-native/docs/assets/GettingStartedCreateAVDMacOS.png" alt="Android Studio AVD Manager"></p>
|
||||
<p><block class="native mac windows linux android" /></p>
|
||||
<p>Select the "x86 Images" tab, then look for the <strong>Marshmallow</strong> API Level 23, x86_64 ABI image with a Android 6.0 (Google APIs) target.</p>
|
||||
<p>Select the "x86 Images" tab, then look for the <strong>Oreo</strong> API Level 26, x86_64 ABI image with a Android 8.0 (Google APIs) target.</p>
|
||||
<p><block class="native linux android" /></p>
|
||||
<blockquote>
|
||||
<p>We recommend configuring <a href="https://developer.android.com/studio/run/emulator-acceleration.html#vm-linux">VM acceleration</a> on your system to improve performance. Once you've followed those instructions, go back to the AVD Manager.</p>
|
||||
|
||||
@@ -254,7 +254,7 @@
|
||||
</blockquote>
|
||||
<p>Once setup has finalized and you're presented with the Welcome screen, proceed to the next step.</p>
|
||||
<h4><a class="anchor" aria-hidden="true" id="2-install-the-android-sdk"></a><a href="#2-install-the-android-sdk" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>2. Install the Android SDK</h4>
|
||||
<p>Android Studio installs the latest Android SDK by default. Building a React Native app with native code, however, requires the <code>Android 6.0 (Marshmallow)</code> SDK in particular. Additional Android SDKs can be installed through the SDK Manager in Android Studio.</p>
|
||||
<p>Android Studio installs the latest Android SDK by default. Building a React Native app with native code, however, requires the <code>Android 8.0 (Oreo)</code> SDK in particular. Additional Android SDKs can be installed through the SDK Manager in Android Studio.</p>
|
||||
<p>The SDK Manager can be accessed from the "Welcome to Android Studio" screen. Click on "Configure", then select "SDK Manager".</p>
|
||||
<p><block class="native mac android" /></p>
|
||||
<p><img src="/react-native/docs/assets/GettingStartedAndroidStudioWelcomeMacOS.png" alt="Android Studio Welcome"></p>
|
||||
@@ -264,11 +264,9 @@
|
||||
<blockquote>
|
||||
<p>The SDK Manager can also be found within the Android Studio "Preferences" dialog, under <strong>Appearance & Behavior</strong> → <strong>System Settings</strong> → <strong>Android SDK</strong>.</p>
|
||||
</blockquote>
|
||||
<p>Select the "SDK Platforms" tab from within the SDK Manager, then check the box next to "Show Package Details" in the bottom right corner. Look for and expand the <code>Android 6.0 (Marshmallow)</code> entry, then make sure the following items are all checked:</p>
|
||||
<p>Select the "SDK Platforms" tab from within the SDK Manager, then check the box next to "Show Package Details" in the bottom right corner. Look for and expand the <code>Android 8.0 (Oreo)</code> entry, then make sure the following items are all checked:</p>
|
||||
<ul>
|
||||
<li><code>Google APIs</code></li>
|
||||
<li><code>Android SDK Platform 23</code></li>
|
||||
<li><code>Intel x86 Atom_64 System Image</code></li>
|
||||
<li><code>Android SDK Platform 26</code></li>
|
||||
<li><code>Google APIs Intel x86 Atom_64 System Image</code></li>
|
||||
</ul>
|
||||
<p><block class="native mac android" /></p>
|
||||
@@ -276,11 +274,11 @@
|
||||
<p><block class="native windows android" /></p>
|
||||
<p><img src="/react-native/docs/assets/GettingStartedAndroidSDKManagerWindows.png" alt="Android SDK Manager"></p>
|
||||
<p><block class="native windows mac linux android" /></p>
|
||||
<p>Next, select the "SDK Tools" tab and check the box next to "Show Package Details" here as well. Look for and expand the "Android SDK Build-Tools" entry, then make sure that <code>23.0.1</code> is selected.</p>
|
||||
<p>Next, select the "SDK Tools" tab and check the box next to "Show Package Details" here as well. Look for and expand the "Android SDK Build-Tools" entry, then make sure that <code>26.0.3</code> is selected.</p>
|
||||
<p><block class="native mac android" /></p>
|
||||
<p><img src="/react-native/docs/assets/GettingStartedAndroidSDKManagerSDKToolsMacOS.png" alt="Android SDK Manager - 23.0.1 Build Tools"></p>
|
||||
<p><img src="/react-native/docs/assets/GettingStartedAndroidSDKManagerSDKToolsMacOS.png" alt="Android SDK Manager - 26.0.3 Build Tools"></p>
|
||||
<p><block class="native windows android" /></p>
|
||||
<p><img src="/react-native/docs/assets/GettingStartedAndroidSDKManagerSDKToolsWindows.png" alt="Android SDK Manager - 23.0.1 Build Tools"></p>
|
||||
<p><img src="/react-native/docs/assets/GettingStartedAndroidSDKManagerSDKToolsWindows.png" alt="Android SDK Manager - 26.0.3 Build Tools"></p>
|
||||
<p><block class="native windows mac linux android" /></p>
|
||||
<p>Finally, click "Apply" to download and install the Android SDK and related build tools.</p>
|
||||
<p><block class="native mac android" /></p>
|
||||
@@ -353,7 +351,7 @@
|
||||
<p><block class="native mac android" /></p>
|
||||
<p><img src="/react-native/docs/assets/GettingStartedCreateAVDMacOS.png" alt="Android Studio AVD Manager"></p>
|
||||
<p><block class="native mac windows linux android" /></p>
|
||||
<p>Select the "x86 Images" tab, then look for the <strong>Marshmallow</strong> API Level 23, x86_64 ABI image with a Android 6.0 (Google APIs) target.</p>
|
||||
<p>Select the "x86 Images" tab, then look for the <strong>Oreo</strong> API Level 26, x86_64 ABI image with a Android 8.0 (Google APIs) target.</p>
|
||||
<p><block class="native linux android" /></p>
|
||||
<blockquote>
|
||||
<p>We recommend configuring <a href="https://developer.android.com/studio/run/emulator-acceleration.html#vm-linux">VM acceleration</a> on your system to improve performance. Once you've followed those instructions, go back to the AVD Manager.</p>
|
||||
|
||||
@@ -257,10 +257,12 @@ export <span class="hljs-keyword">default</span> <span class="hljs-class"><span
|
||||
<h3><a class="anchor" aria-hidden="true" id="adding-a-packager-config-file"></a><a href="#adding-a-packager-config-file" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Adding a packager config file</h3>
|
||||
<p>Create a folder in your project called packager, and create a single file named config.js. Add the following:</p>
|
||||
<pre><code class="hljs">const<span class="hljs-built_in"> config </span>= {
|
||||
getTransformOptions: () => {
|
||||
return {
|
||||
transform: { inlineRequires: <span class="hljs-literal">true</span> },
|
||||
};
|
||||
transformer: {
|
||||
getTransformOptions: () => {
|
||||
return {
|
||||
transform: { inlineRequires: <span class="hljs-literal">true</span> },
|
||||
};
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
@@ -321,18 +323,19 @@ module.exports =<span class="hljs-built_in"> config;
|
||||
<span class="hljs-keyword">const</span> ROOT_FOLDER = path.resolve(__dirname, <span class="hljs-string">'..'</span>);
|
||||
|
||||
<span class="hljs-keyword">const</span> config = {
|
||||
<span class="hljs-attr">getTransformOptions</span>: <span class="hljs-function"><span class="hljs-params">()</span> =></span> {
|
||||
<span class="hljs-keyword">const</span> moduleMap = {};
|
||||
modulePaths.forEach(<span class="hljs-function"><span class="hljs-params">path</span> =></span> {
|
||||
path = resolve(ROOT_FOLDER, path);
|
||||
<span class="hljs-keyword">if</span> (fs.existsSync(path)) {
|
||||
moduleMap[path] = <span class="hljs-literal">true</span>;
|
||||
}
|
||||
});
|
||||
<span class="hljs-keyword">return</span> {
|
||||
<span class="hljs-attr">preloadedModules</span>: moduleMap,
|
||||
<span class="hljs-attr">transform</span>: { <span class="hljs-attr">inlineRequires</span>: { <span class="hljs-attr">blacklist</span>: moduleMap } },
|
||||
};
|
||||
<span class="hljs-attr">transformer</span>: {
|
||||
<span class="hljs-attr">getTransformOptions</span>: <span class="hljs-function"><span class="hljs-params">()</span> =></span> {
|
||||
<span class="hljs-keyword">const</span> moduleMap = {};
|
||||
modulePaths.forEach(<span class="hljs-function"><span class="hljs-params">path</span> =></span> {
|
||||
<span class="hljs-keyword">if</span> (fs.existsSync(path)) {
|
||||
moduleMap[resolve(path)] = <span class="hljs-literal">true</span>;
|
||||
}
|
||||
});
|
||||
<span class="hljs-keyword">return</span> {
|
||||
<span class="hljs-attr">preloadedModules</span>: moduleMap,
|
||||
<span class="hljs-attr">transform</span>: { <span class="hljs-attr">inlineRequires</span>: { <span class="hljs-attr">blacklist</span>: moduleMap } },
|
||||
};
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
|
||||
@@ -257,10 +257,12 @@ export <span class="hljs-keyword">default</span> <span class="hljs-class"><span
|
||||
<h3><a class="anchor" aria-hidden="true" id="adding-a-packager-config-file"></a><a href="#adding-a-packager-config-file" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Adding a packager config file</h3>
|
||||
<p>Create a folder in your project called packager, and create a single file named config.js. Add the following:</p>
|
||||
<pre><code class="hljs">const<span class="hljs-built_in"> config </span>= {
|
||||
getTransformOptions: () => {
|
||||
return {
|
||||
transform: { inlineRequires: <span class="hljs-literal">true</span> },
|
||||
};
|
||||
transformer: {
|
||||
getTransformOptions: () => {
|
||||
return {
|
||||
transform: { inlineRequires: <span class="hljs-literal">true</span> },
|
||||
};
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
@@ -321,18 +323,19 @@ module.exports =<span class="hljs-built_in"> config;
|
||||
<span class="hljs-keyword">const</span> ROOT_FOLDER = path.resolve(__dirname, <span class="hljs-string">'..'</span>);
|
||||
|
||||
<span class="hljs-keyword">const</span> config = {
|
||||
<span class="hljs-attr">getTransformOptions</span>: <span class="hljs-function"><span class="hljs-params">()</span> =></span> {
|
||||
<span class="hljs-keyword">const</span> moduleMap = {};
|
||||
modulePaths.forEach(<span class="hljs-function"><span class="hljs-params">path</span> =></span> {
|
||||
path = resolve(ROOT_FOLDER, path);
|
||||
<span class="hljs-keyword">if</span> (fs.existsSync(path)) {
|
||||
moduleMap[path] = <span class="hljs-literal">true</span>;
|
||||
}
|
||||
});
|
||||
<span class="hljs-keyword">return</span> {
|
||||
<span class="hljs-attr">preloadedModules</span>: moduleMap,
|
||||
<span class="hljs-attr">transform</span>: { <span class="hljs-attr">inlineRequires</span>: { <span class="hljs-attr">blacklist</span>: moduleMap } },
|
||||
};
|
||||
<span class="hljs-attr">transformer</span>: {
|
||||
<span class="hljs-attr">getTransformOptions</span>: <span class="hljs-function"><span class="hljs-params">()</span> =></span> {
|
||||
<span class="hljs-keyword">const</span> moduleMap = {};
|
||||
modulePaths.forEach(<span class="hljs-function"><span class="hljs-params">path</span> =></span> {
|
||||
<span class="hljs-keyword">if</span> (fs.existsSync(path)) {
|
||||
moduleMap[resolve(path)] = <span class="hljs-literal">true</span>;
|
||||
}
|
||||
});
|
||||
<span class="hljs-keyword">return</span> {
|
||||
<span class="hljs-attr">preloadedModules</span>: moduleMap,
|
||||
<span class="hljs-attr">transform</span>: { <span class="hljs-attr">inlineRequires</span>: { <span class="hljs-attr">blacklist</span>: moduleMap } },
|
||||
};
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
|
||||