CODEWITHSUNDEEP
react-nativereact-navigation
Yunus Güneş
Yunus Güneş

Reputation: 97

react-navigation undefined is not a function (evaluating '(0 _reactnavigation.StackNavigator)')

I'm building a new project. Then I'm installing the react-navigation but it's not working.

Code :

import { StackNavigator, } from 'react-navigation';
import Intro from './src/pages/Intro';

const AppNavigator = StackNavigator({
  Intro: {
    screen: Intro,
    navigationOptions: {
      title: "Intro",
      header: null,
      navigationBar: null
    },
  },
});
export default class App extends Component {
  render() {
    return (
      <AppNavigator />
    );
  }
}

Error :

enter image description here

========================================

Upvotes: 1

Views: 10247

Answers (5)

BaiJiFeiLong
BaiJiFeiLong

Reputation: 4615

I have given it up half a month ago.

However, today it worked without any change, without any dependency refresh!

So, I think maybe it need a computer reboot. WTF.

Upvotes: 2

anudeep n
anudeep n

Reputation: 29

Make sure your react-native, react, react-navigation versions are as follows:

 "react-navigation": "^2.18.2",

 "react": "16.6.0-alpha.8af6728",

 "react-native": "0.57.4",

Hope this helps you. Because the latest version of v3.0 has more issues in navigation.

Upvotes: 0

deepanshu katyal
deepanshu katyal

Reputation: 671

It is 100% working.

Use of react-navigation (3.x) version ^3.0.0:

import {
    createDrawerNavigator,
    createStackNavigator,
    createBottomTabNavigator,
    createAppContainer,
} from 'react-navigation';


const AppNavigator = createStackNavigator({
  Home: { screen: HomeScreen }
});

export default createAppContainer(AppNavigator);

Upvotes: 0

DaoLQ
DaoLQ

Reputation: 988

Installed navigation:

npm install --save react-navigation
npm install --save react-native-gesture-handler
react-native link

Try this App.js:

import React, { Component } from 'react';
import {createStackNavigator, createAppContainer} from 'react-navigation';

import Home from './screens/Home';
import Settings from './screens/Settings';

const AppNavigator = createStackNavigator({
  HomeScreen: { 
    screen: Home,
  },
  SettingScreen: { 
    screen: Settings, 
  },
});

const App = createAppContainer(AppNavigator);

export default App;

Upvotes: 1

kivul
kivul

Reputation: 1158

I'm considering that you installed react-navigation correctly.

npm install --save react-navigation

Try this:

import { createStackNavigator } from 'react-navigation';
import Intro from './src/pages/Intro';

const AppNavigator = createStackNavigator({
  Intro: {
    screen: Intro,
    navigationOptions: {
      title: "Intro",
      header: null,
      navigationBar: null
    },
  },
});
export default class App extends Component {
  render() {
    return (
      <AppNavigator />
    );
  }
}

Upvotes: 1

Related Questions