react-redux: Could not find "store" in either the context or props

I get a Could not find "store" in either the context or props error whenever I try to connect a component to Redux.

When I’m in the debug console I can see that state is defined on this and context but it has a value of undefined. Also, when I inspect createStore I get an object back with dispatch, getState, etc.

import { Provider } from 'react-redux';
import React from 'react';
import reducers from '../config/reducers';
import { createStore } from 'redux';
import routes from '../config/routes';

React.render(
  <Provider store={ createStore(reducers) }>
    { () => routes }
  </Provider>
, document.body);

Component

import React from 'react';

// components
import Footer from './_footer';
import Header from './_header';

// redux
import { connect } from 'react-redux';

import ClientSessionActionCreators from '../../actions/client-session-action-creators';

class ApplicationLayout extends React.Component {
  render() {
    return (
      <div>
        <Header />
        { this.props.children }
        <Footer />
      </div>
    );
  }
}

export default connect(state => state)(ApplicationLayout);

About this issue

Original URL
State: closed
Created 9 years ago
Reactions: 9
Comments: 17 (7 by maintainers)

Most upvoted comments

https://github.com/loganfsmyth/babel-plugin-transform-decorators-legacy#babel-legacy-decorator-plugin

/// WRONG

"plugins": [
  "transform-class-properties",
  "transform-decorators-legacy"
]

// RIGHT

"plugins": [
  "transform-decorators-legacy",
  "transform-class-properties"
]

lonelyclick on Sep 30, 2016

I had a similar issue. Turned out that in babel 6 babel-plugin-transform-decorators-legacy does not handle class properties properly. If you are using babel-plugin-transform-decorators-legacy and set the contextType of your class using a static property babel is actually erroneously applying that static property to the decorated class (ie. the object returned by the connect decorator) instead of your original class.

Once I’ve got a test case to prove it I’m going to file an issue with babel-plugin-transform-decorators-legacy.

D1plo1d on Feb 23, 2016

I run into the same issue, but on the server side. And not sure if its possible with node to have the issue of 2 React instances.

Are there any troubleshooting ideas for the Server Side?

KeKs0r on Jul 28, 2016

I updated the doc to document your problem: https://github.com/gaearon/react-redux/blob/master/README.md#could-not-find-store-in-either-the-context-or-props

If you use React Router, something like <Provider>{() => routes}</Provider> won’t work. Due to the way context works in React 0.13, it’s important that the <Provider> children are created inside that function. Just referencing an outside variable doesn’t do the trick. Instead of <Provider>{() => routes}</Provider>, write <Provider>{createRoutes}</Provider> where createRoutes() is a function that actually creates (and returns) the route configuration.

gaearon on Aug 15, 2015

I don’t understand. How can I use redux on a sidebar for instance? My sidebar is always visible, it doesn’t depends on the routes.

micky2be on Nov 27, 2015

@micky2be It’s hard to help without seeing your code 😃. With React 0.14 it should be enough just to wrap root component of your app into Provider. The discussion above is no longer relevant.

gaearon on Nov 27, 2015