question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Error instantiating router

See original GitHub issue

I’ve been following the example as closely as I can. I have managed to get the server to render, but when the browser renders I get this error. Can you please point me in the right direction?

Uncaught Invariant Violation: Could not find "store" in either the context or props of "ConnectedRouter". Either wrap the root component in a <Provider>, or explicitly pass "store" as a prop to "ConnectedRouter".
    at invariant (webpack:////.../node_modules/invariant/browser.js?:38:15)
    at new Connect (webpack:////.../node_modules/found/node_modules/react-redux/es/components/connectAdvanced.js?:132:57)
    at constructClassInstance (webpack:////.../node_modules/react-dom/cjs/react-dom.development.js?:11222:18)
    at updateClassComponent (webpack:////.../node_modules/react-dom/cjs/react-dom.development.js?:14346:5)
    at beginWork (webpack:////.../node_modules/react-dom/cjs/react-dom.development.js?:15222:16)
    at performUnitOfWork (webpack:////.../node_modules/react-dom/cjs/react-dom.development.js?:18789:12)
    at workLoop (webpack:////.../node_modules/react-dom/cjs/react-dom.development.js?:18829:24)
    at HTMLUnknownElement.callCallback (webpack:////.../node_modules/react-dom/cjs/react-dom.development.js?:149:14)
    at Object.invokeGuardedCallbackDev (webpack:////.../node_modules/react-dom/cjs/react-dom.development.js?:199:16)
    at invokeGuardedCallback (webpack:////.../node_modules/react-dom/cjs/react-dom.development.js?:256:31)

react-website.js

import routes from './routes'
import container from './Container'

const reducers = {
  // don't any particular need reducers for now
};

export default {
  container,
  reducers,
  routes,
}

Container.js

import React, { Component } from 'react'
import PropTypes from 'prop-types'
import { Provider } from 'react-redux'
import { hot } from 'react-hot-loader'

function Container({ store, children }) {
  console.log(store, children)
  return (
    <Provider store={store}>
    {children}
    </Provider>
  )
}

Container.propTypes = {
  store: PropTypes.object.isRequired
}

export default hot(module)(Container)

routes.js

import React from 'react'
import { Route } from 'react-website'

import App from './App'
import Example from './Example'

export default (
  <Route path="/" Component={ App }>
    <Route Component={ Example }/>
  </Route>
)

It looks like Container is wrapping the ConnectedRouter, and passing an object into it (with things like dispatch, subscribe, getState on it) which looks like a store. So I’m not entirely sure why this error would come about.

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Comments:5 (5 by maintainers)

github_iconTop GitHub Comments

1reaction
catamphetaminecommented, Feb 21, 2019

Ok. Thanks for the fix in the readme.

0reactions
catamphetaminecommented, Sep 23, 2019

FYI: I’m releasing a new version of this library and also renaming it to react-pages (currently 0.2.3). It uses the latest found and react-redux now. Seems to be working for now, I’ll be running more tests later and version 1.0.0 will be released after that.

Read more comments on GitHub >

github_iconTop Results From Across the Web

A router outlet has not been instantiated during routes activation
Multiple components were navigating the router, and I tested this navigation with the following code: spyOn(component.router, 'navigate').and.
Read more >
BEA-382016 - Failed to instantiate router for service ...
I got the following error from server B in a cluster but not from server A. Can you let me know what could...
Read more >
Angular route error: "A router outlet has not been instantiated ...
Coding example for the question Angular route error: "A router outlet has not been instantiated during routes activation"-angular.js.
Read more >
ERROR:Route:471 - This design is unrouteable. Router will ...
52558 - 14.2 Route - "ERROR:Route:471 - This design is ... Instantiating the IDDR with the correct connectivity will resolve the issue.
Read more >
RouterOutlet - Angular
A router outlet emits an activate event when a new component is instantiated, deactivate event when a component is destroyed. An attached event...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found