gatsby: install gatsby-transformer-remark breaks 'gatsby develop'
When I install gatsby-transformer-remark it breaks the development environment for that site. Tried this 3 times from a fresh install using npm.
1 - Install new gatsby site. 2 - Install gatsby-transformer-remark
Initial Error
There was a problem loading the local develop command. Gatsby may not be installed. Perhaps you need to run "npm install"? Cannot find module 'react'
Error: Cannot find module 'react'
- loader.js:636 Function.Module._resolveFilename
internal/modules/cjs/loader.js:636:15
- loader.js:562 Function.Module._load
internal/modules/cjs/loader.js:562:25
- loader.js:690 Module.require
internal/modules/cjs/loader.js:690:17
- v8-compile-cache.js:159 require
[myNewBlog]/[v8-compile-cache]/v8-compile-cache.js:159:20
- instance.js:8 Object.<anonymous>
[myNewBlog]/[ink]/build/instance.js:8:37
- v8-compile-cache.js:178 Module._compile
[myNewBlog]/[v8-compile-cache]/v8-compile-cache.js:178:30
- loader.js:787 Object.Module._extensions..js
internal/modules/cjs/loader.js:787:10
- loader.js:653 Module.load
internal/modules/cjs/loader.js:653:32
- loader.js:593 tryModuleLoad
internal/modules/cjs/loader.js:593:12
- loader.js:585 Function.Module._load
internal/modules/cjs/loader.js:585:3
Tried reinstalling package via npm i
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
[myNewBlog]/[gatsby]/[react]/cjs/react.development.js:1590:13
- react.development.js:1618 useState
[myNewBlog]/[gatsby]/[react]/cjs/react.development.js:1618:20
- context.js:17 StoreStateProvider
[myNewBlog]/[gatsby]/[gatsby-cli]/lib/reporter/loggers/ink/context.js:17:41
- react-reconciler.development.js:5671 renderWithHooks
[myNewBlog]/[react-reconciler]/cjs/react-reconciler.development.js:5671:18
- react-reconciler.development.js:7905 mountIndeterminateComponent
[myNewBlog]/[react-reconciler]/cjs/react-reconciler.development.js:7905:13
- react-reconciler.development.js:9049 beginWork$1
[myNewBlog]/[react-reconciler]/cjs/react-reconciler.development.js:9049:16
- react-reconciler.development.js:10317 Object.invokeGuardedCallbackImpl
[myNewBlog]/[react-reconciler]/cjs/react-reconciler.development.js:10317:10
- react-reconciler.development.js:10501 invokeGuardedCallback
[myNewBlog]/[react-reconciler]/cjs/react-reconciler.development.js:10501:31
- react-reconciler.development.js:14014 beginWork$$1
[myNewBlog]/[react-reconciler]/cjs/react-reconciler.development.js:14014:7
- react-reconciler.development.js:13008 performUnitOfWork
[myNewBlog]/[react-reconciler]/cjs/react-reconciler.development.js:13008:12
System: OS: macOS 10.15 CPU: (8) x64 Intel® Core™ i5-8259U CPU @ 2.30GHz Shell: 3.2.57 - /bin/bash Binaries: Node: 10.16.0 - ~/.nvm/versions/node/v10.16.0/bin/node Yarn: 1.17.3 - ~/.nvm/versions/node/v10.16.0/bin/yarn npm: 6.9.0 - ~/.nvm/versions/node/v10.16.0/bin/npm Languages: Python: 2.7.16 - /usr/bin/python Browsers: Chrome: 77.0.3865.120 Firefox: 70.0 Safari: 13.0.2 npmPackages: gatsby: ^2.17.4 => 2.17.4 gatsby-image: ^2.2.29 => 2.2.29 gatsby-plugin-manifest: ^2.2.23 => 2.2.23 gatsby-plugin-offline: ^3.0.16 => 3.0.16 gatsby-plugin-react-helmet: ^3.1.13 => 3.1.13 gatsby-plugin-sharp: ^2.2.32 => 2.2.32 gatsby-source-filesystem: ^2.1.33 => 2.1.33 gatsby-transformer-remark: ^2.6.30 => 2.6.30 gatsby-transformer-sharp: ^2.3.0 => 2.3.0 npmGlobalPackages: gatsby-cli: 2.8.5
About this issue
- Original URL
- State: closed
- Created 5 years ago
- Reactions: 11
- Comments: 45 (14 by maintainers)
Commits related to this issue
- update ancient gatsby version https://github.com/gatsbyjs/gatsby/issues/19064 — committed to RegionHalland/our-way-client-old by davidohlin 5 years ago
- fixed building error: https://github.com/gatsbyjs/gatsby/issues/19064 — committed to RichardMEN11/shopmanagement by RichardMEN11 3 years ago
Had this problem today, required delete of
package-lock.jsonand also the commands below:This is what fixed it for me: update gatsby and react to the latest version
Remove node_modules and package.json
Install everything from scratch
@frankdilo - by “removing package.json” you meant “removing package-lock.json”, didn’t you?
Hi, this is also happening to me when trying to install the
gatsby-source-github-apiplugin, the command line displays the exact same errors, I’m using Windows 10: Steps:gatsby develophere, everything works as it shouldgatsby developnow, it shows theError: Cannot find module 'react'gatsby developnow, this is the output:Don’t know what could be happening with plugins maybe? I don’t really know
It seems to be when updating
gatsby-plugin-sharp. dependa-bot tried to update it on my repo, and it starts to fail https://github.com/astroregulus/dicionario-astrologico/pull/12This issue may happen if you mix
npmandyarn- if initial dependencies were installed with yarn and after that you use npm - it will leave node_modules in broken state. That’s why removing node_modules and reinstalling it workAfter a little bit of investigation, I found that the problem started occurring at gatsby@2.16.4. #18752 seems to have introduced the issue. But I will need to investigate a little more to know exactly what’s going on. For now I have downgraded to v2.16.3 and it’s working again.
Yes, it started happening in one of my project too. It was working until I updated to the latest version of gatsby and plugins. I am still debugging to see what changed.
Save my day! Thanks!
The same Error has just occurred to me when running the script:
npm run developto restart my local gatsby dev server, the solution is still the same: just remove thepackage-lock.jsonandnode_modulesfolder and then run the command:npm iThat should be it.
Extending on what my colleague said: The issue could also be an outdated Node version, I’d try upgrading to Node 12, clear your npm cache and re-install again. Furthermore from personal experience npm is sometimes really flaky in installing dependencies and leaves node_modules in a broken state. I personally have much better experiences with yarn than with npm in that regard.
I can’t reproduce the problem with the given reproduction steps here so this is a system environment issue.
We’re marking this issue as answered and closing it for now but please feel free to comment here if you would like to continue this discussion. We also recommend heading over to our communities if you have questions that are not bug reports or feature requests. We hope we managed to help and thank you for using Gatsby!
@trkohler try
yarn-deduplicate(https://www.npmjs.com/package/yarn-deduplicate)If this won’t help, open a new issue. This one is closed for a while and we would need more information about your error messages to help you
Just ran into this issue while trying to install gatsby-plugin-sass. To fix, I removed package.json lockfile and yarn installed. Everything worked for me.
Switching to yarn wasn’t an option for me. Updating
reactandreact-domto16.11.0fixed this.@axe312ger
Thanks for your valuable time and insights.
@weisisheng From my experience, both tend to mess up node_modules an their own lock files every once and a while. NPM does this more often.
What in most cases helped, no matter if GatsbyJS related or not:
Delete lock file, delete node_modules, install again. No matter if using npm or yarn.
Sorry, I know this has been closed…
But I still get the same issue. I have had to erase and reinstall my OS this week for unrelated issues so my Catalina OS is completely fresh.
I am using NVM so have the latest Node version running.
I haven’t mixed NPM or Yarn. Just tried with NPM.
Still get this issue. Will try rolling back like what The Future 2092 suggests.
Update: I didn’t roll back to an older version. I just switched to using yarn. Now it seems to compile without any errors, very strange.
Occurred for me after upgrading a few gatsby dependencies. Deleting
node_modules&&yarn.lockhelped