What Is the Main Entry Point for the React Native Package?

The main entry point for the React Native package is defined by the main field in packages/react-native/package.json, which points to ./index.js—a file that lazily re-exports every public component and API through getter functions to optimize startup performance.

When you import from the react-native npm package, the resolution chain begins at a specific entry point configured in the facebook/react-native repository. Understanding this main entry point helps developers debug module resolution, optimize bundle sizes, and trace how public APIs map to internal implementations.

How the Entry Point Is Defined in package.json

The React Native package manifest declares its runtime entry point through the standard Node.js main field. In packages/react-native/package.json, this property is explicitly set to "./index.js" at lines 29-31.

{
  "main": "./index.js"
}

This configuration instructs Node.js, Metro, and other compatible bundlers to load packages/react-native/index.js whenever the package is required or imported.

Inside the Runtime Entry Point (index.js)

The file packages/react-native/index.js serves as the central runtime entry point for the entire framework. Rather than statically importing all components—which would dramatically increase startup time—this file implements a lazy-loading pattern using JavaScript getters.

At lines 16-34 of index.js, each public API is mapped to a getter function that dynamically requires the corresponding implementation from the Libraries/ directory only when accessed.

// Conceptual structure of the lazy-loading pattern in index.js
get View() {
  return require('./Libraries/Components/View/View').default;
},
get Text() {
  return require('./Libraries/Text/Text').default;
}

This architecture ensures that importing react-native does not immediately load every component. Instead, individual modules like View, Text, or FlatList are resolved on-demand from their respective source files within packages/react-native/Libraries/.

Practical Import Examples

When you write import { View, Text } from 'react-native', the bundler resolves this to the main entry point, which then triggers the specific getters for each symbol.

// Basic component imports resolved through the main entry point
import { View, Text, Button } from 'react-native';
// Resolves to: packages/react-native/index.js → getters → 
// ./Libraries/Components/View/View, ./Libraries/Text/Text, etc.

Accessing low-level APIs follows the same resolution path through the lazy getters:

// Accessing NativeModules via the entry point
import { NativeModules } from 'react-native';
console.log(NativeModules.UIManager);
// Resolved via the getter: get NativeModules() { return require(...); }

The internal implementation demonstrates how dynamic requires work within the entry point:

// Dynamic resolution triggered by property access
const { FlatList } = require('react-native');
// Internally triggers:
// get FlatList() {
//   return require('./Libraries/Lists/FlatList').default;
// }

Supporting Files and Type Definitions

Alongside the runtime entry point, the React Native package includes a corresponding Flow type definition file. The packages/react-native/index.js.flow file mirrors the public API surface defined in index.js, providing static type checking for Flow-enabled projects while maintaining the same export structure and lazy-loading interface.

Summary

• The main entry point for the React Native package is declared in packages/react-native/package.json via the "main": "./index.js" field.
• The runtime entry point at packages/react-native/index.js uses lazy getter functions to re-export public APIs, loading modules from Libraries/ only when accessed.
• This architecture minimizes startup overhead and preserves backward compatibility while supporting both static imports and dynamic requires.
• A parallel Flow type definition exists in index.js.flow to support static type checking of the exported APIs.

Frequently Asked Questions

Where is the main entry point configured in the React Native source code?

The configuration resides in packages/react-native/package.json at lines 29-31, where the main property is set to "./index.js". This file path serves as the canonical entry point whenever code imports from the react-native package.

How does React Native keep startup times low with its entry point architecture?

Instead of statically requiring all components at the top of the file, packages/react-native/index.js implements lazy getters for each export. These getters invoke require() only when a specific property like View or Text is first accessed, ensuring unused modules never load into memory.

What happens when I import { FlatList } from 'react-native'?

The import statement resolves to the main entry point (index.js), which triggers the corresponding getter function. This getter dynamically executes require('./Libraries/Lists/FlatList').default, returning the component while keeping other unused library code out of the initial bundle.

Is there a TypeScript or Flow definition file for the entry point?

Yes. The repository includes packages/react-native/index.js.flow, which provides Flow type definitions that mirror the runtime exports in index.js. This allows Flow-enabled projects to receive static type checking for all APIs exposed through the main entry point.

{
  "mcpServers": {
    "instagit": {
      "command": "npx",
      "args": ["-y", "instagit@latest"]
    }
  }
}