JordyBobs
JordyBobs

Reputation: 137

How to export a reducer from a react redux based node module

I have a project which needs to import a component from an external node module, the project and component both use React and Redux and I would like them to both share the same store.

Heres's a sample of the reducer of the node module component:

export default function search(state = INITIAL_STATE, action) {
switch (action.type) {
    case SET_SEARCH_STRING:
        return state.set("searchString", action.searchString);
    case SET_SEARCH_TYPE:
        return state.set("searchType", action.searchType);

Here's the exporting of the component in the node module:

var SearchReducer = require("./WebContent/js/reducers/search");
var CollectionsReducer = require("./WebContent/js/reducers/collections");

exports.SearchReducer = SearchReducer;
exports.CollectionsReducer = CollectionsReducer;

Here's the import in the main project

import content from "./content"
    import SearchReducer from "search-ui";
    import CollectionsReducer from "search-ui";

    const REDUCERS = {content, SearchReducer, CollectionsReducer};
    export default combineReducers(REDUCERS);

When I try to load the page I get a Type Error

Uncaught TypeError: reducer is not a function - combineReducers.js:37

Now if I provide a direct path to the node module reducers -

i.e import collections from "../../../node_modules/search-ui/WebContent/js/reducers/collections";

it works fine, so my questions is, what am I doing wrong in terms of importing and exporting?

Upvotes: 3

Views: 1457

Answers (1)

Alex Driaguine
Alex Driaguine

Reputation: 500

Since it's not a default export, try this.

import {SearchReducer, CollectionsReducer} from 'search-ui'

Alternatively, you could provide the full path but there is no need to make it relative

import SearchReducer from 'search-ui/WebContent/js/reducers/search'
import CollectionsReducer from 'search-ui/WebContent/js/reducers/collections

Upvotes: 3

Related Questions