You must pass a component to the function returned by connect. Instead received undefined

You are doing import PostList from '../components/PostList'; so you need to use export default in your PostList.js file.

Otherwise you need to do import { PostList } from '../components/PostList';.

To whoever is interested, here is a nice article about es6 import/export syntax: http://www.2ality.com/2014/09/es6-modules-final.html


Not related to the asker specifically, but if you're facing this error, it's worth to check if you have the connect() syntax right:

const PreloadConnect = connect(mapStateToProps, {})(Preload);

export default PreloadConnect;

Note that Preload, is passed as a IIFE parameter.


More details can be found here.

There might be three reasons, that are summarized as follows:

  • Circular dependencies between components
  • Wrong usage of export and export default then imported the wrong way
  • Used the connect function wrongly, passed the wrong parameters

In my case is was Circular dependencies, and the circular-dependency-plugin helped me fix it.