mirror of
https://github.com/facebook/react-native.git
synced 2025-11-01 09:14:26 +00:00
Jakub Grzywacz
864833fca9
Summary: On Android, when resource shrinking is enabled, all resources added by Metro may be removed as react-native is accessing resources based on strings rather than references, so AGP can't see its usage. Example output of `android/app/build/outputs/mapping/release/resources.txt `when `shrinkResources` is enabled. ``` raw/__node_modules_expo_vectoricons_build_vendor_reactnativevectoricons_fonts_materialcommunityicons : reachable=false drawable/__common_assets_haptics_icon : reachable=false ``` It’s a coincidence that most of the resources are currently working, as many file names begin with strings that already exist in the String Pool. For example, `node_modules...` is flagged as used because 'node' is present in the String Pool, causing it to be whitelisted. However, this does not guarantee that the same will apply to all files - especially in a monorepo setup, where paths are significantly different. For example * `__node_modules_expo_vectoricons_build_vendor_reactnativevectoricons_fonts_materialcommunityicons` * `__common_assets_haptics_icon` To prevent that behavior, metro during assets export should create `keep.xml` listing all resources generated by metro. https://developer.android.com/build/shrink-code#keep-resources We have already made a similar change in expo cli: https://github.com/expo/expo/pull/35465 ## Changelog: [ANDROID][ADDED] - Generate keep.xml to prevent resource shrinking Pull Request resolved: https://github.com/facebook/react-native/pull/50620 Test Plan: 1. Enable resource shrinking in RNTester by adding this to `android.buildTypes.release` to `packages/rn-tester/android/app/build.gradle.kts` ```gradle isMinifyEnabled = true isShrinkResources = true ``` 2. Use some resources in playground, for example: ```diff diff --git a/packages/rn-tester/js/examples/Playground/RNTesterPlayground.js b/packages/rn-tester/js/examples/Playground/RNTesterPlayground.js index 9dbacb99701..9ac9c231f3f 100644 --- a/packages/rn-tester/js/examples/Playground/RNTesterPlayground.js +++ b/packages/rn-tester/js/examples/Playground/RNTesterPlayground.js @@ -11,16 +11,14 @@ import type {RNTesterModuleExample} from '../../types/RNTesterTypes'; -import RNTesterText from '../../components/RNTesterText'; import * as React from 'react'; import {StyleSheet, View} from 'react-native'; +import {Header} from "react-native/Libraries/NewAppScreen"; function Playground() { return ( <View style={styles.container}> - <RNTesterText> - Edit "RNTesterPlayground.js" to change this file - </RNTesterText> + <Header /> </View> ); } ``` 3. Build app using `hermesRelease` variant 4. See Playground screen | Before | After | |---|---| | <img width="488" alt="Zrzut ekranu 2025-04-10 o 12 17 53" src="https://github.com/user-attachments/assets/24fcaa7b-6ddb-4ba6-9fe5-65c27bcbc931" /> | <img width="488" alt="Zrzut ekranu 2025-04-10 o 12 15 58" src="https://github.com/user-attachments/assets/09a1ce77-be26-4571-a4b8-c466bf19e026" /> | 5. Inspect `packages/rn-tester/android/app/build/outputs/mapping/hermesRelease/resources.txt` | Before | After | |---|---| | `drawable/_reactnative_libraries_newappscreen_components_logo : reachable=false` | `drawable/_reactnative_libraries_newappscreen_components_logo : reachable=true` | Reviewed By: cortinico Differential Revision: D72960028 Pulled By: huntie fbshipit-source-id: df725fa2ea50150cd67687a97986976ffbbb5b40
@react-native/community-cli-plugin
This is an internal dependency of React Native. Please don't depend on it directly.
CLI entry points supporting core React Native development features.
Formerly @react-native-community/cli-plugin-metro.
Commands
start
Start the React Native development server.
Usage
npx @react-native-community/cli start [options]
Options
| Option | Description |
|---|---|
--port <number> |
Set the server port. |
--host <string> |
Set the server host. |
--projectRoot <path> |
Set the path to the project root. |
--watchFolders <list> |
Specify additional folders to be added to the watch list. |
--assetPlugins <list> |
Specify additional asset plugins. |
--sourceExts <list> |
Specify additional source extensions to bundle. |
--max-workers <number> |
Set the maximum number of workers the worker-pool will spawn for transforming files. Defaults to the number of the cores available on your machine. |
--transformer <string> |
Specify a custom transformer. |
--reset-cache |
Remove cached files. |
--custom-log-reporter-path <string> |
Specify a module path exporting a replacement for TerminalReporter. |
--https |
Enable HTTPS connections. |
--key <path> |
Specify path to a custom SSL key. |
--cert <path> |
Specify path to a custom SSL cert. |
--config <string> |
Path to the CLI configuration file. |
--no-interactive |
Disable interactive mode. |
--client-logs |
[Deprecated] Enable plain text JavaScript log streaming for all connected apps. |
bundle
Build the bundle for the provided JavaScript entry file.
Usage
npx @react-native-community/cli bundle --entry-file <path> [options]
Options
| Option | Description |
|---|---|
--entry-file <path> |
Set the path to the root JavaScript entry file. |
--platform <string> |
Set the target platform (either "android" or "ios"). Defaults to "ios". |
--transformer <string> |
Specify a custom transformer. |
--dev [boolean] |
If false, warnings are disabled and the bundle is minified. Defaults to true. |
--minify [boolean] |
Allows overriding whether bundle is minified. Defaults to false if --dev is set. Disabling minification can be useful for speeding up production builds for testing purposes. |
--bundle-output <string> |
Specify the path to store the resulting bundle. |
--bundle-encoding <string> |
Specify the encoding for writing the bundle (https://nodejs.org/api/buffer.html#buffer_buffer). |
--resolver-option <string...> |
Custom resolver options of the form key=value. URL-encoded. May be specified multiple times. |
--sourcemap-output <string> |
Specify the path to store the source map file for the resulting bundle. |
--sourcemap-sources-root <string> |
Set the root path for source map entries. |
--sourcemap-use-absolute-path |
Report SourceMapURL using its full path. |
--max-workers <number> |
Set the maximum number of workers the worker-pool will spawn for transforming files. Defaults to the number of the cores available on your machine. |
--assets-dest <string> |
Specify the directory path for storing assets referenced in the bundle. |
--reset-cache |
Remove cached files. |
--read-global-cache |
Attempt to fetch transformed JS code from the global cache, if configured. Defaults to false. |
--config <string> |
Path to the CLI configuration file. |
Contributing
Changes to this package can be made locally and tested against the rn-tester app, per the Contributing guide. During development, this package is automatically run from source with no build step.