insin / gatsby-plugin-dark-mode

A Gatsby plugin which handles some of the details of implementing a dark mode theme
MIT License
68 stars 19 forks source link

Cannot read property '__reactstandin__key' of undefined #5

Open davidballester opened 5 years ago

davidballester commented 5 years ago

Hi! I've seen this plugin and it does exactly what I wanted to do, so I'm giving it a try. However, I'm facing this issue. This is the strack trace I get on runtime.

react-hot-loader.development.js:1229 Uncaught TypeError: Cannot read property '__reactstandin__key' of undefined
    at isProxyType (react-hot-loader.development.js:1229)
    at resolveProxy (react-hot-loader.development.js:1770)
    at resolveSimpleType (react-hot-loader.development.js:1786)
    at React$$1.createElement (react-hot-loader.development.js:2820)
    at jsx (core.browser.esm.js:102)
    at MyThemeToggler (my-theme-toggler.js:1)
    at renderWithHooks (react-dom.development.js:15105)
    at updateFunctionComponent (react-dom.development.js:16922)
    at beginWork$1 (react-dom.development.js:18495)
    at HTMLUnknownElement.callCallback (react-dom.development.js:348)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:398)
    at invokeGuardedCallback (react-dom.development.js:455)
    at beginWork$$1 (react-dom.development.js:23214)
    at performUnitOfWork (react-dom.development.js:22205)
    at workLoopSync (react-dom.development.js:22182)
    at renderRoot (react-dom.development.js:21875)
    at runRootCallback (react-dom.development.js:21551)
    at react-dom.development.js:11354
    at unstable_runWithPriority (scheduler.development.js:643)
    at runWithPriority$2 (react-dom.development.js:11306)
    at flushSyncCallbackQueueImpl (react-dom.development.js:11350)
    at flushSyncCallbackQueue (react-dom.development.js:11339)
    at scheduleUpdateOnFiber (react-dom.development.js:21428)
    at Object.enqueueForceUpdate (react-dom.development.js:13146)
    at ExportedComponent../node_modules/react/cjs/react.development.js.Component.forceUpdate (react.development.js:343)
    at react-hot-loader.development.js:2973
    at Array.forEach (<anonymous>)
    at react-hot-loader.development.js:2972

My dependencies are these:

    "@emotion/core": "10.0.16",
    "@emotion/styled": "10.0.15",
    "gatsby": "^2.13.65",
    "gatsby-image": "^2.2.8",
    "gatsby-plugin-dark-mode": "1.1.0",
    "gatsby-plugin-emotion": "4.1.2",
    "gatsby-plugin-feed": "^2.3.6",
    "gatsby-plugin-google-analytics": "^2.1.7",
    "gatsby-plugin-i18n": "1.0.1",
    "gatsby-plugin-manifest": "^2.2.5",
    "gatsby-plugin-offline": "^2.2.6",
    "gatsby-plugin-react-helmet": "^3.1.3",
    "gatsby-plugin-sharp": "^2.2.11",
    "gatsby-plugin-typography": "^2.3.2",
    "gatsby-remark-copy-linked-files": "^2.1.6",
    "gatsby-remark-images": "^3.1.12",
    "gatsby-remark-prismjs": "^3.3.5",
    "gatsby-remark-responsive-iframe": "^2.2.4",
    "gatsby-remark-smartypants": "^2.1.2",
    "gatsby-source-filesystem": "^2.1.9",
    "gatsby-transformer-remark": "^2.6.14",
    "gatsby-transformer-sharp": "^2.2.6",
    "intl": "1.2.5",
    "intl-pluralrules": "1.0.3",
    "prismjs": "^1.17.1",
    "react": "^16.9.0",
    "react-dom": "^16.9.0",
    "react-helmet": "^5.2.1",
    "react-intl": "3.1.9",
    "react-typography": "^0.16.19",
    "typeface-merriweather": "0.0.72",
    "typeface-montserrat": "0.0.75",
    "typography": "^0.16.19",
    "typography-theme-wordpress-2016": "^0.16.19"

I'm going to dive into the code to look for the issue.

davidballester commented 5 years ago

If I copy just the contents of the plugin (ThemeTogger.js and gatsby-ssr.js), it works, so it might be a dependencies issue.