React Native 0.80: Stabilizing the JavaScript API – A Migration Guide

Overview

React Native 0.80 introduces two foundational changes aimed at making the JavaScript API more stable and type-safe: the deprecation of deep imports and the introduction of an opt-in Strict TypeScript API. These updates are part of a long-term effort to define a clear, predictable public API surface for the react-native package, reducing breaking changes and improving developer experience. In this guide, you will learn what these changes mean, why they matter, and how to migrate your existing projects.

Prerequisites

Before you begin, ensure you have:

• A React Native project (version 0.80 or later).
• Node.js 18+ installed.
• Basic familiarity with JavaScript/TypeScript and React Native.
• ESLint configured (optional but recommended for detecting deprecated imports).

Step-by-Step Migration Instructions

1. Understanding the Changes

Historically, React Native allowed deep imports from internal paths like react-native/Libraries/Alert/Alert. These imports bypass the public API and depend on implementation details that may change without notice. Starting in 0.80, deep imports trigger deprecation warnings (via ESLint and console). The eventual goal is to remove them entirely in 0.82. Simultaneously, React Native is moving from hand-maintained (Flow‑based) TypeScript types to a generated, stricter TypeScript API. This opt‑in feature replaces community‑contributed types with a more accurate and future‑proof baseline.

2. Updating Deep Imports to Root Imports

Replace any import that uses a subpath under react-native with the equivalent root import. For example:

// Before (deep import)
import { Alert } from 'react-native/Libraries/Alert/Alert';

// After (root import)
import { Alert } from 'react-native';

Common deep imports to look for include:

• react-native/Libraries/.../Component
• react-native/Libraries/Utilities/...
• react-native/Libraries/Type/...

If a component or utility is not exported at the root, it may be an internal API not intended for public use. In such cases, check the community feedback thread or consider alternative implementations.

To help identify all deep imports, run ESLint with the @react-native/eslint-plugin and enable the rule react-native/no-unused-styles or the dedicated deep-import rule (if available). Alternatively, search your codebase for patterns like from 'react-native/Libraries/.

3. Opting Into the Strict TypeScript API

The Strict TypeScript API is opt‑in in 0.80 and will become the default in a future release. To enable it, modify your tsconfig.json:

{
  "compilerOptions": {
    "strict": true,
    "paths": {
      "react-native": ["./node_modules/react-native/index"],
      "react-native/*": ["./node_modules/react-native/*"]
    },
    // Additional required settings
    "moduleResolution": "node",
    "target": "esnext",
    "jsx": "react-native"
  },
  "include": ["src"]
}

Note: The exact configuration may evolve. Refer to the official TypeScript documentation for the most current settings. The key is to enable the path overrides that point to the generated type definitions provided by React Native.

Once configured, run tsc --noEmit to check for type errors. The new API baseline may surface stricter type requirements, such as correct generic usage or non‑optional props. Update your code to comply.

4. Testing the Migration

After updating imports and TypeScript settings:

1. Clear caches: npx react-native start --reset-cache
2. Rebuild your app: npx react-native run-android or npx react-native run-ios
3. Run npx tsc --noEmit to verify type correctness.
4. Run your existing test suite.

Pay close attention to any TypeScript errors that appear after enabling the Strict TypeScript API—they indicate either missing type definitions or genuine type mismatches that need fixing.

5. Providing Feedback (if a needed API is missing)

If you discover that an API you rely on is not exported from the root of react-native after migrating, participate in the community feedback thread. The React Native team is finalizing the public API surface and welcomes input before deep imports are removed.

Common Mistakes

Forgetting to update all deep imports

Searching only by react-native/Libraries may miss relative or dynamic imports. Use a comprehensive search tool (e.g., grep -r "from 'react-native/Libraries" in your source directory) and inspect any third‑party libraries that may have deep imports.

Misconfiguring tsconfig paths

Incorrect path mappings can lead to unresolved modules or type resolution failures. Ensure the paths entries point to the correct location within node_modules/react-native. Always verify by running tsc after changes.

Ignoring deprecation warnings

In 0.80, deep imports still work but produce warnings. Do not suppress them—they will become errors in 0.82. Fix all warnings now to avoid future breakage.

Assuming all types are now automatically accurate

The Strict TypeScript API improves type safety but does not guarantee perfect types for all third‑party components or dynamic patterns. You may still need to add type assertions or refine your own types.

Summary

React Native 0.80 introduces two major changes: deprecation of deep imports (with removal planned for 0.82) and an opt‑in Strict TypeScript API that provides a more accurate, generated type baseline. By migrating now—updating all deep imports to root imports and enabling the new TypeScript configuration—you align your project with a more stable and predictable API. Key steps: replace subpath imports (e.g., from 'react-native/Libraries/…'), modify tsconfig.json to point to the new type definitions, test thoroughly, and provide feedback if needed. These changes lay the groundwork for a future where React Native’s JavaScript API is clearly defined and reliably typed, reducing surprises in upgrades.