Sign Up for Free

RunKit +

Try any Node.js package right in your browser

This is a playground to test code. It runs a full Node.js environment and already has all of npm’s 400,000 packages pre-installed, including react-navigation-stack with all npm packages installed. Try it out:

require("@react-native-community/masked-view/package.json"); // @react-native-community/masked-view is a peer dependency. require("react/package.json"); // react is a peer dependency. require("react-native/package.json"); // react-native is a peer dependency. require("react-native-gesture-handler/package.json"); // react-native-gesture-handler is a peer dependency. require("react-native-safe-area-context/package.json"); // react-native-safe-area-context is a peer dependency. require("react-native-screens/package.json"); // react-native-screens is a peer dependency. require("react-navigation/package.json"); // react-navigation is a peer dependency. var reactNavigationStack = require("react-navigation-stack")

This service is provided by RunKit and is not affiliated with npm, Inc or the package authors.

react-navigation-stack v2.8.2

Stack navigator component for React Navigation

React Navigation Stack

Build Status Version MIT License

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 sync, then change the files in src/vendor and then run yarn patch 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.

RunKit is a free, in-browser JavaScript dev environment for prototyping Node.js code, with every npm package installed. Sign up to share your code.
Sign Up for Free