react-simple-maps
react-simple-maps copied to clipboard
Error possibly related to react functional components
I'm getting the following error with the latest release (2.1.2):
react.development.js:315 Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.
Check the render method of `Map`.
in Map (created by Transition)
in Transition (created by ForwardRef(Slide))
in ForwardRef(Slide) (created by HomePage)
in div (created by HomePage)
in div (created by ForwardRef(Paper))
in ForwardRef(Paper) (created by WithStyles(ForwardRef(Paper)))
in WithStyles(ForwardRef(Paper)) (created by HomePage)
in HomePage (created by WithWidth(HomePage))
in WithWidth(HomePage) (created by Context.Consumer)
in withRouter(WithWidth(HomePage)) (created by Query)
in Query (created by Context.Consumer)
in DocumentTitle (created by SideEffect(DocumentTitle))
in SideEffect(DocumentTitle) (created by HomeRoute)
in HomeRoute (created by Context.Consumer)
in SecureRoute
in Switch
in div (created by Navigation)
in Navigation (created by Context.Consumer)
in withRouter(Navigation) (created by WithWidth(withRouter(Navigation)))
in WithWidth(withRouter(Navigation)) (created by Mutation)
in Mutation (created by App)
in MuiPickersUtilsProvider (created by App)
in ThemeProvider (created by App)
in App (created by Context.Consumer)
in withRouter(App)
in Router (created by BrowserRouter)
in BrowserRouter
in ApolloProvider
printWarning @ react.development.js:315
error @ react.development.js:287
createElementWithValidation @ react.development.js:1788
render @ Map.js:249
finishClassComponent @ react-dom.development.js:17160
updateClassComponent @ react-dom.development.js:17110
beginWork @ react-dom.development.js:18620
beginWork$1 @ react-dom.development.js:23179
performUnitOfWork @ react-dom.development.js:22157
workLoopSync @ react-dom.development.js:22130
performSyncWorkOnRoot @ react-dom.development.js:21756
(anonymous) @ react-dom.development.js:11089
unstable_runWithPriority @ scheduler.development.js:653
runWithPriority$1 @ react-dom.development.js:11039
flushSyncCallbackQueueImpl @ react-dom.development.js:11084
flushSyncCallbackQueue @ react-dom.development.js:11072
unbatchedUpdates @ react-dom.development.js:21909
legacyRenderSubtreeIntoContainer @ react-dom.development.js:24757
render @ react-dom.development.js:24840
./src/client/index.js @ index.js:31
__webpack_require__ @ bootstrap:18
(anonymous) @ bootstrap:93
(anonymous) @ bootstrap:94
index.umd.js:1 Uncaught TypeError: p[r] is not a function
at projectionConfig.center (index.umd.js:1)
at index.umd.js:1
at mountMemo (react-dom.development.js:15442)
at Object.useMemo (react-dom.development.js:15738)
at Object.useMemo (react.development.js:1521)
at m (index.umd.js:1)
at renderWithHooks (react-dom.development.js:14803)
at mountIndeterminateComponent (react-dom.development.js:17482)
at beginWork (react-dom.development.js:18596)
at HTMLUnknownElement.callCallback (react-dom.development.js:188)
I suspect this may be due to the switch of this project from React Class Components to React Functional Components. Seems like functional components don't play nicely with methods from class components? If so, that kind of sucks, as its going to take a considerable effort to re-write my Class components to be Functional components to be compatible with your latest releases. Is there any way it can be written to work with both?
This is occurring for me as well as I attempt to upgrade my class components to functional components. I think I've got it all setup in a complimentary way to how it was, but I'm getting this error and having a hard time reasoning about it.