React & Redux: Uncaught TypeError: (0 , _reactRedux.connect) is not a function

Josue Toledo picture Josue Toledo · Jul 23, 2018 · Viewed 8.5k times · Source

I am new with redux, react and parceljs. I'm currently experimenting with this 3 stuff by doing the redux tutorial. And after parceljs did it job, when I went to the browser I got this error on the console:

Uncaught TypeError: (0 , _reactRedux.connect) is not a function

The code right now is

import { connect } from 'react-redux';
const AddTodo = ({dispatch}) => {
.
.
.
}
export default connect()(AddTodo)

I changed:

import { connect } from 'react-redux';

to:

import { connect } from 'redux';

and gave me basically same error.

What should I do in this case?

I checked the documentation and issues and the only issues I found about connect() is that you cannot use it as a decorator but that's it. Am I missing something I don't know yet?

(Sorry for my bad grammar in English, not my first language)

Answer

Bhojendra Rauniyar picture Bhojendra Rauniyar · Jul 23, 2018

To use connect, you need to bind the component not an object. Thus, you may change your todo

const AddTodo = {

With:

const AddTodo = () => { // a stateless component
 // now, you can return the object
 return ( // just an example
  <div>
   <input type="text" />
  </div>
  )
}

And the connect is imported from react-redux:

import { connect } from 'react-redux'; // this is correct