react-navigation-stack

React Navigation Stack

Stack navigator for use on iOS and Android.

Installation

Open a Terminal in your project's folder and run,

yarn add react-navigation-stack @react-native-community/masked-view react-native-safe-area-context

or

npm install react-navigation-stack @react-native-community/masked-view react-native-safe-area-context

Usage

import { createStackNavigator } from 'react-navigation-stack';

export default createStackNavigator({
  Inbox: InboxScreen,
  Drafts: DraftsScreen,
}, {
  initialRouteName: 'Inbox',
});

Development workflow

To setup the development environment, open a Terminal in the repo directory and run the following:

yarn bootstrap

While developing, you can run the example app with Expo to test your changes:

yarn example start

The code in this repo uses the source from @react-navigation/stack and patches it to make it usable in React Navigation 4. If you need to make changes, please send a pull request there.

If the change is specifically related to React Navigation 4 integration, first run yarn patch:apply, then change the files in src/vendor to resolve any conflicts and then run yarn patch:create to update the patch file with the latest changes.

Make sure your code passes TypeScript and ESLint. Run the following to verify:

yarn typescript
yarn lint

To fix formatting errors, run the following:

yarn lint --fix

Docs

Documentation can be found on the React Navigation website.