036e9444 - feat(metro-config): support any entry file in development builds that don't use Expo dev client (#21643)

Tue, 28 Mar 2023 18:51:07 +0000

feat(metro-config): support any entry file in development builds that don't use Expo dev client (#21643)# Why - React Native enforces that apps must use `index.js` as the entry file, this is highly inconvenient and forces us to change the app entry on `expo prebuild` (cite: [prebuild side effects](https://github.com/expo/expo/blob/4d2795e/docs/pages/workflow/prebuild.mdx#side-effects) (`index.js` and `package.json` `scripts`)). - In #14964 I added support for production Android apps to use any entry point. - In #18381 I added the same support to iOS apps in production. - Development builds using `expo-dev-client` and Expo Go both use a manifest which support arbitrary entry points. - This just leaves development builds that don't have Expo code-loading support (e.g. no manifest/index.html where the script can be changed dynamically). # How - This PR introduces the virtual entry file `.expo/.virtual-metro-entry` which should never physically exist. When this endpoint is pinged, Expo CLI will rewrite the the URL to the correct entry point based on the project configuration. This enables us to fully drop the prebuild side-effect as no case will require an `index.js` (`index.bundle`) as the entry file. - The rewrite means Metro will never support a physical file located at `.expo/.virtual-metro-entry.js` as this will always be ignored. We could support forwarding the request if this file exists but we'll probably go the other way and assert if this file exists to mitigate possible confusion. - The name `.expo/.virtual-metro-entry.js` was chosen to be clear and long enough that users wouldn't try to actually create this file. - I originally tried using a middleware to perform the redirect but this wouldn't work with the HMR server which emulates pinging the endpoint in-memory. Because of this, I went with the metro `server.rewriteRequestUrl` function. > This feature is implemented in Expo's Metro configuration, meaning it should apply to `npx react-native start` (but this is untested and not officially supported). ## New Setup Instructions for non-prebuild users Non-prebuild projects will need to modify their `AppDelegate.mm` as follows: ```diff - (NSURL *)sourceURLForBridge:(RCTBridge *)bridge { #if DEBUG - return [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index"]; + return [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@".expo/.virtual-metro-entry"]; #else return [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"]; #endif } ``` And their `android/app/src/main/java/***/MainApplication.java`: ```diff @Override protected String getJSMainModuleName() { - return "index"; + return ".expo/.virtual-metro-entry"; } ``` This is of course in addition to the `android/app/build.gradle`: ```groovy entryFile = file(["node", "-e", "require('expo/scripts/resolveAppEntry')", projectRoot, "android", "absolute"].execute(null, rootDir).text.trim()) ``` And iOS production change: ``` shellScript = "if [[ -f \"$PODS_ROOT/../.xcode.env\" ]]; then\n source \"$PODS_ROOT/../.xcode.env\"\nfi\nif [[ -f \"$PODS_ROOT/../.xcode.env.local\" ]]; then\n source \"$PODS_ROOT/../.xcode.env.local\"\nfi\n\n# The project root by default is one level up from the ios directory\nexport PROJECT_ROOT=\"$PROJECT_DIR\"/..\n\nif [[ \"$CONFIGURATION\" = *Debug* ]]; then\n export SKIP_BUNDLING=1\nfi\nif [[ -z \"$ENTRY_FILE\" ]]; then\n # Set the entry JS file using the bundler's entry resolution.\n export ENTRY_FILE=\"$(\"$NODE_BINARY\" -e \"require('expo/scripts/resolveAppEntry')\" $PROJECT_ROOT ios relative | tail -n 1)\"\nfi\n\n`\"$NODE_BINARY\" --print \"require('path').dirname(require.resolve('react-native/package.json')) + '/scripts/react-native-xcode.sh'\"`\n\n"; ``` # Test Plan ### Continuous(-ish) - Updated the templates to use this new format. ### Quick test - Start the dev server and ping the entry URL directly: - `http://localhost:8081/.expo/.virtual-metro-entry.bundle?platform=web&dev=true&minify=false&modulesOnly=true&runModule=false&shallow=true` - The redirected URL should show in the `sourceURL` at the end of the file. ### E2E - Prebuild, then apply the native changes in a local projects - Use the following `metro.config.js` (you don't need to use the latest Expo CLI for this to work): ```js // Learn more https://docs.expo.io/guides/customizing-metro const { getDefaultConfig } = require("../../expo/packages/@expo/metro-config"); // const { getDefaultConfig } = require('expo/metro-config'); module.exports = getDefaultConfig(__dirname); ``` - `npx expo run:ios` and `npx expo run:android` should point to `index.bundle` - Changing the `main` field in the package.json or deleting `index.js` should continue to work when you reload the app. # Checklist - [ ] Documentation is up to date to reflect these changes (eg: https://docs.expo.dev and README.md). - [ ] Conforms with the [Documentation Writing Style Guide](https://github.com/expo/expo/blob/main/guides/Expo%20Documentation%20Writing%20Style%20Guide.md) - [ ] This diff will work correctly for `expo prebuild` & EAS Build (eg: updated a module plugin). --------- Co-authored-by: Expo Bot <34669131+expo-bot@users.noreply.github.com> List of files: /expo/packages/@expo/cli/src/prebuild/__tests__/fixtures/react-native-project.ts

b47ee281 - feat(expo)!: use Expo CLI when building for development in Xcode (#21397)

Mon, 13 Mar 2023 15:59:08 +0000

feat(expo)!: use Expo CLI when building for development in Xcode (#21397)# Why - Related #21396 - Use `npx expo start --dev-client` instead of `npx react-native start` when building a project from Xcode. This ensures we use the correct version of Metro regardless of where the project is started. - It's unclear if building from Android Studio is supposed to trigger the bundler in development but I couldn't get it to do so, so this PR is iOS-only. # How - Copy over a bunch of the default scripts from `react-native/scripts` into the same locations in `expo/scripts` to make it easy to maintain this change and simple to migrate. I decided to omit the following as it appeared to be unused (sets RCT_METRO_PORT): ``` source "$THIS_DIR/.packager.env" ``` I also dropped: - Support for `$RCT_PACKAGER_LOGS_DIR`. - The `Process terminated. Press to close the window` log that is presented after closing the dev server. - Support for a custom React Native CLI config (this is not supported in Expo CLI). # Test Plan - TBD - Building for development from Xcode causes a terminal window running `npx expo start` will open instead of the community version. # Checklist - [ ] Documentation is up to date to reflect these changes (eg: https://docs.expo.dev and README.md). - [ ] Conforms with the [Documentation Writing Style Guide](https://github.com/expo/expo/blob/main/guides/Expo%20Documentation%20Writing%20Style%20Guide.md) - [ ] This diff will work correctly for `expo prebuild` & EAS Build (eg: updated a module plugin). --------- Co-authored-by: Expo Bot <34669131+expo-bot@users.noreply.github.com> Co-authored-by: Kudo Chien List of files: /expo/packages/@expo/cli/src/prebuild/__tests__/fixtures/react-native-project.ts

8d307f52 - chore: refactor `expo/cli` to `@expo/cli` package (#16717)

Wed, 23 Mar 2022 16:50:13 +0000

chore: refactor `expo/cli` to `@expo/cli` package (#16717)* chore: refactor `expo/cli` to `@expo/cli` package * Update CODEOWNERS * fix linking * fix lint script * fix build file * fix e2e tests * lint before build * use mock version List of files: /expo/packages/@expo/cli/src/prebuild/__tests__/fixtures/react-native-project.ts

Changes in react-native-project.ts

036e9444 - feat(metro-config): support any entry file in development builds that don't use Expo dev client (#21643)

b47ee281 - feat(expo)!: use Expo CLI when building for development in Xcode (#21397)

8d307f52 - chore: refactor `expo/cli` to `@expo/cli` package (#16717)