React Navigation Stack

Stack navigator for use on iOS and Android.

Installation

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

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

or

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

Usage

1import { createStackNavigator } from 'react-navigation-stack';
2
3export default createStackNavigator({
4  Inbox: InboxScreen,
5  Drafts: DraftsScreen,
6}, {
7  initialRouteName: 'Inbox',
8});

Development workflow

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

1yarn bootstrap

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

1yarn 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:

1yarn typescript
2yarn lint

To fix formatting errors, run the following:

1yarn lint --fix

Docs

Documentation can be found on the React Navigation website.