custom-prebuild-example
Demonstration of out-of-tree platforms for Expo Prebuild and Config Plugins
This project demonstrates how Expo Prebuild could be leveraged to run on out-of-tree platforms, with fully customizable templates.
It's set-up to use prebuild for android, ios, macos, and windows, using the custom template from this repository.
Warning We recently merged PR #22224 and PR #22201, which is required for this demonstration. Because these pull requests aren't released yet, this repository contains a modified
@expo/cliand@expo/config-pluginversions. (see ./app/plugins)
Project Structure
-
app- Example app, created usingnpx react-native init -
app/plugins- All plugins required to support out-of-tree platforms -
template- A customized prebuild template
How to use it
To get your hands dirty, follow these steps.
-
$ cd ./template- Before you can use prebuild, we have to create a template tarball -
$ npm pack- This creates a tarball that we can pass to prebuild
After this, you can generate the native files for any of the platforms below.
All of the platform folders (./android, ./ios, ./macos, and ./windows) are gitignored and can be fully regenerated.
Use ... prebuild --clean or rm -rf ./macos to regenerate the files.
MacOS
-
$ cd ./app- Go to the app folder -
$ bundle install- Install all gems -
$ yarn install- Install all modules, including prebuild -
$ npx expo prebuild --platform macos --template ../template/custom-prebuild-template-1.0.0.tgz- Use prebuild to generate the./macosfolder -
$ npx pod-install macos- Make sure the pods for./macosare installed -
$ npx react-native run-macos- Run the project normally
Note This not only generates the files from the template, it also runs the
./app/plugins/macos/withWindowSizeplugin. Try to customize this in./app/app.jsonand let prebuild configure the native files for you.
Windows
-
$ cd ./app- Go to the app folder -
$ yarn install- Install all modules, including prebuild -
$ npx expo prebuild --platform windows --template ../template/custom-prebuild-template-1.0.0.tgz- Use prebuild to generate the./windowsfolder -
$ npx react-native run-windows- Run the project normally
Note This not only generates the files from the template, it also changes settings in
windows/NuGet.Configandwindows/ExperimentalFeatures.props. Try to customize this in./app/app.jsonand let prebuild configure the native files for you.
Android
-
$ cd ./app- Go to the app folder -
$ yarn install- Install all modules, including prebuild -
$ npx expo prebuild --platform android --template ../template/custom-prebuild-template-1.0.0.tgz- Use prebuild to generate the./androidfolder -
$ npx react-native run-android- Run the project normally
iOS
-
$ cd ./app- Go to the app folder -
$ bundle install- Install all gems -
$ yarn install- Install all modules, including prebuild -
$ npx expo prebuild --platform ios --template ../template/custom-prebuild-template-1.0.0.tgz- Use prebuild to generate the./iosfolder -
$ npx pod-install ios- Make sure the pods for./iosare installed -
$ npx react-native run-ios- Run the project normally
How to customize it
Take a look at the existing prebuild plugins, especially the macos or windows part.
This can be done for any platform, modifier, or change required.
Learn more about custom base modifiers