I was working on my Gatsby project and tried adding the React Cookie Consent package. After installing it and trying to implement it, my site broke down, proving me with this error:
warn ./.cache/root.js
Attempted import error: 'BaseContext' is not exported from '@gatsbyjs/reach-router' (imported as 'BaseContext').
I can't seem to find a fix, nor do I know why it is happening. Localhost is throwing me this error:
_gatsbyjs_reach_router__WEBPACK_IMPORTED_MODULE_2__.BaseContext is undefined
Any help is welcome! Thank you :)
Upon trying deleting the cache folder by running:
gatsby clean
If the issue persist, try bypassing the SSR limitation by adding the following to your gatsby-node.js:
exports.onCreateWebpackConfig = ({actions, loaders, stage}) => {
if (stage === "build-html") {
actions.setWebpackConfig({
module: {
rules: [
{
test: /react-cookie-consent/,
use: loaders.null(),
},
],
}
})
}
};
Or using a dynamic import:
useEffect(() => {
(async () => {
const { getCookieConsentValue, Cookies } = await import('react-cookie-consent')
getCookieConsentValue('test')
Cookies.get()
})()
}, [])
You can check for further approaches at: https://github.com/Mastermindzh/react-cookie-consent/issues/136