CODEWITHSUNDEEP
react-nativereact-navigationstack-navigator
dilanMD
dilanMD

Reputation: 95

Undefined is not a function (near '...(0,_reactNavigation.StackNavigator)...')

I'm doing a study project (Weather application) in react native. I'm using react-navigation v4. It gives the above mentioned error. Please anybody help to resolve this.

//Index.js

import React from "react";
import { AppRegistry } from 'react-native';
import App from './App';
import { name as appName } from './app.json';
import { createStore, applyMiddleware } from 'redux';
import reducer from "./reducers";
import { Provider } from 'react-redux';
import thunk from 'redux-thunk';

import { StackNavigator } from 'react-navigation';
import WeatherDetails from './screens/WeatherDetails';
import CityLists from './screens/CityLists';

const Navigation = StackNavigator({
  WeatherDetails: { screen: WeatherDetails },
  CityLists: { screen: CityLists }
});

const store = createStore(reducer, applyMiddleware(thunk));

const wrapper = () => {
  return (
    <Provider store={store}>
      <Navigation />
    </Provider>
  );
}

AppRegistry.registerComponent(appName, () => wrapper);

Upvotes: 0

Views: 2942

Answers (1)

Kishan Bharda
Kishan Bharda

Reputation: 5700

As described in react-navigationv(4.0) documentation you have to install StackNavigator separately. So first install StackNavigator :

npm install react-navigation-stack --save

Then import createStackNavigator from react-navigation-stack : 

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

Now, create navigation : 

const Navigation = createStackNavigator ({
  WeatherDetails: { screen: WeatherDetails },
  CityLists: { screen: CityLists }
});

Upvotes: 1

Related Questions