在Redux-React Native中使用reducer时导入/导出

Question

I'm studying Redux with React Native and I have an example like this:

---

reducer.js

import {combineReducers} from "redux"; 
import {HomeReducer as home} from "../routes/Home/modules/home";

const makeRootReducer = () => {
    return combineReducers({
        home
    });
};

export default makeRootReducer;

---

createStore.js

import {createStore, applyMiddleware, compose} from 'redux';
import thunk from "redux-thunk";
import {createLogger} from 'redux-logger';

import makeRouteReducer from './reducer';

const log = createLogger({diff: true, collapsed: true});

export default (initialState = {}) => {
    const middleware = [thunk, log];
    const enhancers = [];

    return store = createStore(
        makeRouteReducer(),
        initialState,
        compose(
            applyMiddleware(...middleware),
            ...enhancers
        )
    );
}

---

It works fine but I don't understand why I have to use export default in reducer.js .

When I try to use

// reducer.js
export makeRootReducer

and

// createStore.js
import {makeRouteReducer} from './reducer';

It didn't work.

Please help me by explaining it in detail.

Thank you very much.

Answer 1

You're talking about named exports and default exports ...

Example of a named export:

export const someFunction = () => {
   // some code here...
}

Now you can import this in another file like this:

import {someFumnction} from './nameOfFile'

But if you do:

export default function someFunction () {
   // some code here...
}

That's a default export and you have to import it like this:

import someFunction from './nameOfFile'

In your example if you change this:

const makeRootReducer = () => {
    return combineReducers({
        home
    });
};

export default makeRootReducer;

To this:

export const makeRootReducer = () => {
    return combineReducers({
        home
    });
};

It will become a named export and not a default export and now you can do:

import {makeRootReducer} from....

Hope that clarifies... And here is more info