UNPKG

2.29 kBMarkdownView Raw
1# React Navigation Stack
2
3[![Build Status][build-badge]][build]
4[![Version][version-badge]][package]
5[![MIT License][license-badge]][license]
6
7Stack navigator for use on iOS and Android.
8
9## Installation
10
11Open a Terminal in your project's folder and run,
12
13```sh
14yarn add react-navigation-stack @react-native-community/masked-view react-native-safe-area-context
15```
16
17or
18
19```sh
20npm install react-navigation-stack @react-native-community/masked-view react-native-safe-area-context
21```
22
23## Usage
24
25```js
26import { createStackNavigator } from 'react-navigation-stack';
27
28export default createStackNavigator({
29 Inbox: InboxScreen,
30 Drafts: DraftsScreen,
31}, {
32 initialRouteName: 'Inbox',
33});
34```
35
36## Development workflow
37
38To setup the development environment, open a Terminal in the repo directory and run the following:
39
40```sh
41yarn bootstrap
42```
43
44While developing, you can run the example app with [Expo](https://expo.io/) to test your changes:
45
46```sh
47yarn example start
48```
49
50The code in this repo uses the source from [`@react-navigation/stack`](https://github.com/react-navigation/navigation-ex/tree/master/packages/stack) and patches it to make it usable in React Navigation 4. If you need to make changes, please send a pull request there.
51
52If 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.
53
54Make sure your code passes TypeScript and ESLint. Run the following to verify:
55
56```sh
57yarn typescript
58yarn lint
59```
60
61To fix formatting errors, run the following:
62
63```sh
64yarn lint --fix
65```
66
67## Docs
68
69Documentation can be found on the [React Navigation website](https://reactnavigation.org/docs/en/stack-navigator.html).
70
71<!-- badges -->
72
73[build-badge]: https://img.shields.io/circleci/project/github/react-navigation/stack/master.svg?style=flat-square
74[build]: https://circleci.com/gh/react-navigation/stack
75[version-badge]: https://img.shields.io/npm/v/react-navigation-stack.svg?style=flat-square
76[package]: https://www.npmjs.com/package/react-navigation-stack
77[license-badge]: https://img.shields.io/npm/l/react-navigation-stack.svg?style=flat-square
78[license]: https://opensource.org/licenses/MIT