docz: The above error occurred in the component

Thanks! It works!

But it seems I have to use yarn.

At first, I use npm install, and the same problem occur. Then I use yarn, it works.

@chhuang Interestingly, it solves the issue for me, too, if I remove node_modules and reinstall them with yarn

But I believe that docz should of course support both npm and yarn.

I guess we should find out what exactly leads to this inconsistency. Perhaps docz depends on some package that has yarn-specific behavior.

The app itself works fine with npm.

I ran into this same issue and as @kinsomicrote mentioned it seemed to be related to the Gatsby issue. Removing node_modules, yarn-lock and reinstalling with yarn fixed it for me.

Using yarn instead of npm i solved the issue.

damn, so weird that deleting node_modules and switching to yarn only fixes it, this is the sort of issues I hate, infrastructure/tooling stack issues that are hard to trace the cause of, it could be npm caching or anything else. and what was the cause? upgrading a package by bumping up a version in package.json and npm iing.

here is the full output:

❯  gatsby develop                                                                             ─╯

 ERROR 

The above error occurred in the <StoreStateProvider> component:
    in StoreStateProvider
    in App

React will try to recreate this component tree from scratch using the error boundary you provided, App.


 ERROR 

Warning: App: Error boundaries should implement getDerivedStateFromError(). In that method, return a state update to display an error message or fallback UI.


 ERROR 

UNHANDLED REJECTION Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:
1. You might have mismatching versions of React and the renderer (such as React DOM)
2. You might be breaking the Rules of Hooks
3. You might have more than one copy of React in the same app
See https://fb.me/react-invalid-hook-call for tips about how to debug and fix this problem.



  Error: Invalid hook call. Hooks can only be called inside of the body of a function component.   This could happen for one of the following reasons:
  1. You might have mismatching versions of React and the renderer (such as React DOM)
  2. You might be breaking the Rules of Hooks
  3. You might have more than one copy of React in the same app
  See https://fb.me/react-invalid-hook-call for tips about how to debug and fix this problem.
  
  - react.development.js:1590 resolveDispatcher
    [gatsby-ionic]/[gatsby]/[react]/cjs/react.development.js:1590:13
  
  - react.development.js:1618 useState
    [gatsby-ionic]/[gatsby]/[react]/cjs/react.development.js:1618:20
  
  - context.js:17 StoreStateProvider
    [gatsby-ionic]/[gatsby]/[gatsby-cli]/lib/reporter/loggers/ink/context.js:17:41
  
  - react-reconciler.development.js:6036 renderWithHooks
    [gatsby-ionic]/[react-reconciler]/cjs/react-reconciler.development.js:6036:18
  
  - react-reconciler.development.js:8570 mountIndeterminateComponent
    [gatsby-ionic]/[react-reconciler]/cjs/react-reconciler.development.js:8570:13
  
  - react-reconciler.development.js:9938 beginWork$1
    [gatsby-ionic]/[react-reconciler]/cjs/react-reconciler.development.js:9938:16
  
  - react-reconciler.development.js:11563 Object.invokeGuardedCallbackImpl
    [gatsby-ionic]/[react-reconciler]/cjs/react-reconciler.development.js:11563:10
  
  - react-reconciler.development.js:11740 invokeGuardedCallback
    [gatsby-ionic]/[react-reconciler]/cjs/react-reconciler.development.js:11740:31
  
  - react-reconciler.development.js:15778 beginWork$$1
    [gatsby-ionic]/[react-reconciler]/cjs/react-reconciler.development.js:15778:7
  
  - react-reconciler.development.js:14696 performUnitOfWork
    [gatsby-ionic]/[react-reconciler]/cjs/react-reconciler.development.js:14696:12

PS: I’m using only Gatsby, not docz.

With npm upgrading react and react-dom to 16.12.0 and reinstalling node_modules fixed the problem for me

how can I get this working with npm?.. It’s not possible for me to migrate to yarn right now

I’m having the exact same issue. I’m not using any additional docz plugins, though. Basically, I have this:

{
  "devDependencies": {
    "docz": "^2.0.0-rc.71"
  }
}

I’m running docz as ./node_modules/.bin/docz dev

I have this output:

> ./node_modules/.bin/docz dev

Building app
The above error occurred in the <StoreStateProvider> component:
    in StoreStateProvider
    in App

React will try to recreate this component tree from scratch using the error boundary you provided, App.
Warning: App: Error boundaries should implement getDerivedStateFromError(). In that method, return a state update to display an error message or fallback UI.