This is documentation for the next SDK version. For up-to-date documentation, see the latest version (SDK 51).
A universal component that allows setting the initial React component to render natively in the app's root React Native view.
GitHub
npm
Sets the initial React component to render natively in the app's root React Native view on Android, iOS, and the web. It also adds dev-only debugging tools for use with npx expo start
.
-Â
npx expo install expo
This is only required if your app does not use Expo Prebuild to continuously generate the android directory.
Update the android/app/src/main/your-package/MainActivity.java file to use the name main
in the getMainComponentName
function.
@Override
protected String getMainComponentName() {
+ return "main";
}
This is only required if your app does not use Expo Prebuild to continuously generate the ios directory.
Update the iOS ios/your-name/AppDelegate.(m|mm|swift) file to use the moduleName main
in the createRootViewWithBridge:bridge moduleName:@"main" initialProperties:initProps
line of the application:didFinishLaunchingWithOptions:
function.
import { registerRootComponent } from 'expo';
registerRootComponent(component)
Sets the initial React component to render natively in your app's root React Native view (RCTView
).
This function does the following:
AppRegistry.runApplication
on web to render to the root index.html
file.process.nextTick
function globally.fontFamily
React Native style with the expo-font
package.This function also adds the following dev-only features that are removed in production bundles.
expo-updates
package is misconfigured.react-native
is not aliased to react-native-web
when running in the browser.No return value.
You can set the "main"
in package.json to any file within your project. If you do this, then you need to use registerRootComponent
,
export default
will not make this component the root for the app if you are using a custom entry file.
For example, let's say you want to make src/main.jsx the entry file for your app - maybe you don't like having JavaScript files in the project root. First, set this in package.json:
{
"main": "src/main.jsx"
}
Then in src/main.jsx, make sure you call registerRootComponent
and pass in the component you want to render at the root of the app.
import { registerRootComponent } from 'expo';
import { View } from 'react-native';
function App() {
return <View />;
}
registerRootComponent(App);