ERROR TypeError: store.getState is not a function. (In 'store.getState()', 'store.getState' is undefined)

Question

store.js

// Imports: Dependencies
import { createStore } from 'redux';
import employeeDetailReducer from './employeeDetailReducer';
// Middleware: Redux Persist Config
const store = createStore(employeeDetailReducer);

employeeDetailReducer.js

const initialState = {
    employeeDetails: {
        name: "",
        schoolName: "",
        companyName: ""
    }
};
const employeeDetailReducer = (state = initialState, action) => {
    switch (action.type) {
        case "SAVE_EMPLOYEE_DETAIL": {
            return {
                ...state,
                employeeDetails: action.employeeDetails
            }
        }
        default: {
            return state;
        }
    }
}
export default employeeDetailReducer;

EmployeeDetails.js

import React from "react";
import { View, Text, StyleSheet, SafeAreaView, TextInput, TouchableHighlight } from "react-native";
import { connect } from "react-redux"
import { saveEmployeeDetails } from "./saveEmployeeDetailAction"
class EmployeeDetails extends React.Component {
    constructor(props) {
        super(props)
        this.state = {
            name: "",
            schoolName: "",
            companyName: ""
        }
    }
    render() {
        return (
            <SafeAreaView style={styles.container}>
                <View style={styles.mainView}>
                    <Text style={styles.mainTextStyle}>Submit Employee Details</Text>
                    <Text style={styles.textStyle}>Enter Your Name</Text>
                    <TextInput
                        style={styles.textInputStyle}
                        underlineColorAndroid="transparent"
                        placeholderTextColor="#cccccc"
                        placeholder="Enter Your Name"
                        onChangeText={name => {
                            this.setState({ name: name }, () => {
                            });
                        }}
                    />
                    <Text style={styles.textStyle}>Enter Your School Name</Text>
                    <TextInput
                        style={styles.textInputStyle}
                        underlineColorAndroid="transparent"
                        placeholderTextColor="#cccccc"
                        placeholder="Enter Your School Name"
                        onChangeText={schoolName => {
                            this.setState({ schoolName: schoolName }, () => {
                            });
                        }}
                    />
                    <Text style={styles.textStyle}>Enter Your Company Name</Text>
                    <TextInput
                        style={styles.textInputStyle}
                        underlineColorAndroid="transparent"
                        placeholderTextColor="#cccccc"
                        placeholder="Enter Your Company Name"
                        onChangeText={companyName => {
                            this.setState({ companyName: companyName }, () => {
                            });
                        }}
                    />
                    <TouchableHighlight
                        underlayColor="transparent"
                        style={styles.buttonStyle}
                        onPress={() => {
                            var employeeDetails = {};
                            employeeDetails.name = this.state.name;
                            employeeDetails.schoolName = this.state.schoolName;
                            employeeDetails.companyName = this.state.companyName;
                            this.props.reduxSaveEmployeeDetail(employeeDetails)
                            this.props.navigation.navigate("ShowEmployeeDetail")
                        }}
                    >
                        <Text style={styles.buttonTextStyle}>Submit</Text>
                    </TouchableHighlight>
                </View>
            </SafeAreaView>
        )
    }
}
const styles = StyleSheet.create({
    container: {
        flex: 1,
        width: "100%",
        height: "100%",
        justifyContent: 'flex-start',
        alignItems: 'center',
        backgroundColor: "lightgray",
        paddingBottom: 50
    },
    mainView: {
        width: "100%",
        height: "50%",
        justifyContent: "flex-start",
        alignItems: "center",
        padding: 20,
    },
    textInputStyle: {
        width: "100%",
        height: 40,
        backgroundColor: "white",
        paddingHorizontal: 15,
        marginBottom: 10,
        marginTop: 10
    },
    textStyle: {
        width: "100%",
        height: 20,
        textAlign: "left",
        marginTop: 10,
        fontSize: 15
    },
    mainTextStyle: {
        width: "100%",
        height: 40,
        //paddingHorizontal:15,
        textAlign: "center",
        marginTop: 10,
        marginBottom: 10,
        fontSize: 20
    },
    buttonStyle: {
        width: "100%",
        height: 40,
        borderRadius: 5,
        justifyContent: "center",
        alignItems: "center",
        backgroundColor: "white",
        marginTop: 20
    },
    buttonTextStyle: {
        width: "100%",
        height: "100%",
        textAlign: "center",
        marginTop: 10,
        fontSize: 18
    },
})
const mapDispatchToProps = (dispatch) => {
    return {
        reduxSaveEmployeeDetail: (employeDetails) => dispatch(saveEmployeeDetails(employeDetails))
    }
}
export default connect(
    null,
    mapDispatchToProps
)(EmployeeDetails);

App.js

import React from 'react';
import { Provider } from 'react-redux';
import store from './store'
import { NavigationContainer } from '@react-navigation/native';
import { createNativeStackNavigator } from '@react-navigation/native-stack';
import EmployeeDetali from './EmployeeDetali';
import ShowEmployeeDetail from './ShowEmployeeDetail';
export default App = () => {
    return (

        <Provider store={store}>
            <AppNavigator />
        </Provider>
    );
};

const Stack = createNativeStackNavigator();

const AppNavigator = () => {
    return (
        <NavigationContainer initialState="EmployeeDetali">
            <Stack.Screen name="EmployeeDetali" component={EmployeeDetali} />
            <Stack.Screen name="ShowEmployeeDetail" component={ShowEmployeeDetail} />
        </NavigationContainer>
    )
}

Error

 ERROR  TypeError: store.getState is not a function. (In 'store.getState()', 'store.getState' is undefined)

This error is located at:
    in Provider (created by App)
    in App
    in RCTView (created by View)
    in View (created by AppContainer)
    in RCTView (created by View)
    in View (created by AppContainer)
    in AppContainer
    in ReactNativeApp(RootComponent)

I don't know what is wrong here...

• I'm also add store like this

import {store} from './store'

• It also give me error so how can soul my error where is my error

• I don't have any idea for adding redux in class component so how I can do this

• I'm learning from here

• I also learn redux

• so anyone give me suggestion what happing in my code

Answer 1

Do,

 export { store };

in store.js.

and,

import {store } from "./store";

in app.js