Search code examples
javascriptreactjsreduxreact-reduxparceljs

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


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)


Solution

  • 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