Redux: Why "combinReduers" can not work at my project today suddenly, which could work well yesterday?

Created on 29 Apr 2016  ·  19Comments  ·  Source: reduxjs/redux

import { combineReducers } from 'redux'
import { routerReducer as router } from 'react-router-redux'
import counter from './modules/counter'
import docManage from './doc'

export default combineReducers({ // error happened
counter,
docManage,
router
})
Uncaught TypeError: (0 , _redux.combineReducers) is not a functionObject.defineProperty.value @ rootReducer.js:6__webpack_require__ @ bootstrap 8921782a133419f3cb76:585fn @ bootstrap 8921782a133419f3cb76:109exports.esModule @ index.js:6__webpack_require @ bootstrap 8921782a133419f3cb76:585fn @ bootstrap 8921782a133419f3cb76:109(anonymous function) @ wrapActionCreators.js:6__webpack_require__ @ bootstrap 8921782a133419f3cb76:585fn @ bootstrap 8921782a133419f3cb76:109exports.esModule @ connect.js:18__webpack_require @ bootstrap 8921782a133419f3cb76:585fn @ bootstrap 8921782a133419f3cb76:109exports.esModule @ index.js:10__webpack_require @ bootstrap 8921782a133419f3cb76:585fn @ bootstrap 8921782a133419f3cb76:109(anonymous function) @ bootstrap 8921782a133419f3cb76:631__webpack_require__ @ bootstrap 8921782a133419f3cb76:585(anonymous function) @ bootstrap 8921782a133419f3cb76:631(anonymous function) @ bootstrap 8921782a133419f3cb76:631

Most helpful comment

@caojinli

When I run npm install inside it, I get

npm WARN EJSONPARSE Failed to parse json
npm WARN EJSONPARSE Unexpected end of input at 171:2
npm WARN EJSONPARSE 
npm WARN EJSONPARSE ^

This means package.json is broken. If we look into package.json, the scripts section ends abruptly:

    "deploy": "better-npm-run deploy",
    "flow:check": "babel-node bin/flow-check",
    "codecov": "cat coverage/*/lcov.info | codecov"
  ,
  "betterScripts": {

I found the exact place of error with http://jsonlint.com/ that formats JSON.
After adding the missing } before the comma, I was able to run npm install.

After I ran npm start, I got this:

ERROR in ./src/redux/actions/manageDoc.js
Module not found: Error: Cannot resolve module 'isomorphic-fetch' in /Users/dan/p/prodoc/src/redux/actions
 @ ./src/redux/actions/manageDoc.js 23:23-50

I ran

npm install --save isomorphic-fetch

to fix it.

Finally, after running npm start again, I got the error you described:

rootReducer.js:6 Uncaught TypeError: (0 , _redux.combineReducers) is not a function
Head.js:66 Uncaught TypeError: (0 , _reactRedux.connect) is not a function

It turned out that you have resolve.root Webpack option enabled that lets you import modules by their paths relative to the root folder. The problem is you have a folder called redux in your project so now all imports of redux resolve to that folder rather than to the real Redux.

Removing resolve.root from Webpack config fixes the issue.

In the future we would prefer that you ask questions like this on StackOverflow, not the Redux issue tracker. Redux is a very specific library, but your problems seem related to using a mix of 20 technologies that you use together without a deep understanding of how each of them works. Personally I don’t understand a lot of what’s going on in that project’s configs, so I wouldn’t use this example at the same time as learning a library like Redux. It doesn’t require any of that configuration.

Copy-pasting configs from boilerplate projects always leads to hard-to-debug issues like this. It’s easy to miss somebody’s configuration decisions when you’re not the one making them. Don’t use boilerplate projects unless you understand each and every technology they use!

You don’t need a boilerplate to start learning Redux. If you just want to start learning Redux, copy this HTML page and start learning! You can always look at all those other projects later when you’re more comfortable with Redux and other libraries.

All 19 comments

Hi! Unfortunately this is not enough information to help you. Please provide a project reproducing the issue.

I’m closing as there is not enough information here, and it’s most likely a usage issue. Please refer to examples to see the correct usage.

What I can give more information is I added some module by "npm" like thunk. then it got error.

Please provide a project reproducing the issue. I can’t find a way to reproduce this, so unfortunately there is no way I could help you.

I can not attach my zipped project about 606KB size, for error from git "Something went really wrong, and we can’t process that file. ". Is there other way I could attach my project?

"Something went really wrong, and we can’t process that file. " when I try to attach my project code, Is there other way to attach my code?

Please delete node_modules from it if it’s there.

You can create a repository on GitHub and push it there rather than attach it.

After I enter" npm publish", console response me "+ [email protected]", I think my project has been updated into github now, but I can not search it at github, don't know why.

npm ERR! extraneous: [email protected] D:\react\react-redux-starter-kitnode_modules\inline-style-prefixer
npm ERR! extraneous: [email protected] D:\react\react-redux-starter-kitnode_modules\isomorphic-fetch
npm ERR! extraneous: [email protected] D:\react\react-redux-starter-kitnode_moduleskeycode
npm ERR! extraneous: lodash.[email protected] D:\react\react-redux-starter-kitnode_modules\lodash.merge
npm ERR! extraneous: lodash.[email protected] D:\react\react-redux-starter-kitnode_modules\lodash.throttle
npm ERR! extraneous: [email protected] D:\react\react-redux-starter-kitnode_modules\react-event-listener
npm ERR! extraneous: [email protected] D:\react\react-redux-starter-kitnode_modules\recompose
npm ERR! extraneous: [email protected] D:\react\react-redux-starter-kitnode_modules\redux-logger
npm ERR! extraneous: [email protected] D:\react\react-redux-starter-kitnode_modules\simple-assign
npm ERR! extraneous: [email protected] D:\react\react-redux-starter-kitnode_modules\whatwg-fetch

@caojinli : so far, it looks like you've tried to publish your repository as an NPM package, not create a repo on Github and make it available. Also, those "extraneous" warnings have nothing to do with Redux - that's NPM saying that there's a mismatch between what packages are in node_modules, and what's listed in your package.json.

The project had been located at URL of https://github.com/caojinli/prodoc, who can get my project with error "combinReduer"? Thanks a lot.

@markerikson I did publish my project into github yet and wish you could supply kindly help, thank you.

@caojinli

When I run npm install inside it, I get

npm WARN EJSONPARSE Failed to parse json
npm WARN EJSONPARSE Unexpected end of input at 171:2
npm WARN EJSONPARSE 
npm WARN EJSONPARSE ^

This means package.json is broken. If we look into package.json, the scripts section ends abruptly:

    "deploy": "better-npm-run deploy",
    "flow:check": "babel-node bin/flow-check",
    "codecov": "cat coverage/*/lcov.info | codecov"
  ,
  "betterScripts": {

I found the exact place of error with http://jsonlint.com/ that formats JSON.
After adding the missing } before the comma, I was able to run npm install.

After I ran npm start, I got this:

ERROR in ./src/redux/actions/manageDoc.js
Module not found: Error: Cannot resolve module 'isomorphic-fetch' in /Users/dan/p/prodoc/src/redux/actions
 @ ./src/redux/actions/manageDoc.js 23:23-50

I ran

npm install --save isomorphic-fetch

to fix it.

Finally, after running npm start again, I got the error you described:

rootReducer.js:6 Uncaught TypeError: (0 , _redux.combineReducers) is not a function
Head.js:66 Uncaught TypeError: (0 , _reactRedux.connect) is not a function

It turned out that you have resolve.root Webpack option enabled that lets you import modules by their paths relative to the root folder. The problem is you have a folder called redux in your project so now all imports of redux resolve to that folder rather than to the real Redux.

Removing resolve.root from Webpack config fixes the issue.

In the future we would prefer that you ask questions like this on StackOverflow, not the Redux issue tracker. Redux is a very specific library, but your problems seem related to using a mix of 20 technologies that you use together without a deep understanding of how each of them works. Personally I don’t understand a lot of what’s going on in that project’s configs, so I wouldn’t use this example at the same time as learning a library like Redux. It doesn’t require any of that configuration.

Copy-pasting configs from boilerplate projects always leads to hard-to-debug issues like this. It’s easy to miss somebody’s configuration decisions when you’re not the one making them. Don’t use boilerplate projects unless you understand each and every technology they use!

You don’t need a boilerplate to start learning Redux. If you just want to start learning Redux, copy this HTML page and start learning! You can always look at all those other projects later when you’re more comfortable with Redux and other libraries.

@gaearon First of all, thank you very much, I did learn much from your reply.
If I disable resolve.root from webpack config file, I got some new errors which could work well previously.
ERROR in ./src/redux/configureStore.js
Module not found: Error: Cannot resolve module 'containers/DevTools' in D:\react\react-redux-starter-kit\srcredux
@ ./src/redux/configureStore.js 29:75-105

ERROR in ./src/containers/Root.js
Module not found: Error: Cannot resolve module 'containers/DevTools' in D:\react\react-redux-starter-kit\srccontainers
@ ./src/containers/Root.js 120:25-55

ERROR in ./src/routes/index.js
Module not found: Error: Cannot resolve module 'layouts/CoreLayout/CoreLayout' in D:\react\react-redux-starter-kit\src\routes
@ ./src/routes/index.js 13:18-58

ERROR in ./src/routes/index.js
Module not found: Error: Cannot resolve module 'views/HomeView/HomeView' in D:\react\react-redux-starter-kit\src\routes
@ ./src/routes/index.js 17:16-50

ERROR in ./src/routes/index.js
Module not found: Error: Cannot resolve module 'views/HomeView/teachers' in D:\react\react-redux-starter-kit\src\routes
@ ./src/routes/index.js 21:16-50

ERROR in ./src/routes/index.js
Module not found: Error: Cannot resolve module 'views/HomeView/docView' in D:\react\react-redux-starter-kit\src\routes
@ ./src/routes/index.js 25:15-48

Plus, I did rename the redux folder from my project after I read your reponse to viod what you mentioned that program will use wrong "redux" instead of real "redux". but unfortunately I still can not run it even I renamed the folder of redux.

@gaearon I foud that the resolve.root in webpack.config.js actually refer to the redux of src, so I can not disable it.

If I disable resolve.root from webpack config file, I got some new errors which could work well previously.

Yes, because you can no longer use absolute paths that are automatically resolved. This is the whole point — you should either

  • rename your folder to be called something other than redux so that resolve.root doesn’t mess it up, or
  • change all your imports to be relative (e.g. ../views/HomeView/docView rather than views/HomeView/docView).

You can’t have both a folder named redux and the resolve.root option and expect this to work.

@gaearon I copied my business codes(including views, reduxs-reducers, components, containers and etc) to another project which could work every well, using same configration(download from github), the working very well project got same error. If I removed my business codes from it and the project worked very well again. So I dare to say it caused by my business code. nothing related to webpack config and there was a folder of redux in my src.

If you see this exact error:

rootReducer.js:6 Uncaught TypeError: (0 , _redux.combineReducers) is not a function
Head.js:66 Uncaught TypeError: (0 , _reactRedux.connect) is not a function

There is no way it can be caused by your business code. This is the error caused by resolve.root configuration. redux provides those exports so the only way you can get this error is if you resolve redux to something other than its npm package.

Of course, any other errors may have different origins.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

captbaritone picture captbaritone  ·  3Comments

vslinko picture vslinko  ·  3Comments

ms88privat picture ms88privat  ·  3Comments

rui-ktei picture rui-ktei  ·  3Comments

mickeyreiss-visor picture mickeyreiss-visor  ·  3Comments