gatsby: gatsby develop is not working after npm install
Description
I was following tutorial at https://next.gatsbyjs.org/tutorial/part-two/#gatsby-plugins but
gatsby develop is not working as expected after the below npm install command
npm install --save gatsby-plugin-typography react-typography typography
gatsby develop command work as expected before the above command.
I am getting the below error when I run gatsby develop command
error There was a problem loading the local develop command. Gatsby may not be installed. Perhaps you need to run "npm install"?
Output of the npm install --save gatsby-plugin-typography react-typography typography
npm WARN rm not removing /Users/mammar/Documents/gatsby/site/tutorial-part-two/node_modules/.bin/gatsby as it wasn't installed by /Users/mammar/Documents/gatsby/site/tutorial-part-two/node_modules/gatsby
npm WARN rm not removing /Users/mammar/Documents/gatsby/site/tutorial-part-two/node_modules/.bin/browserslist as it wasn't installed by /Users/mammar/Documents/gatsby/site/tutorial-part-two/node_modules/browserslist
npm WARN rm not removing /Users/mammar/Documents/gatsby/site/tutorial-part-two/node_modules/.bin/regjsparser as it wasn't installed by /Users/mammar/Documents/gatsby/site/tutorial-part-two/node_modules/regjsparser
npm WARN rm not removing /Users/mammar/Documents/gatsby/site/tutorial-part-two/node_modules/.bin/jsesc as it wasn't installed by /Users/mammar/Documents/gatsby/site/tutorial-part-two/node_modules/jsesc
npm WARN rm not removing /Users/mammar/Documents/gatsby/site/tutorial-part-two/node_modules/fsevents/node_modules/.bin/node-pre-gyp as it wasn't installed by /Users/mammar/Documents/gatsby/site/tutorial-part-two/node_modules/fsevents/node_modules/node-pre-gyp
npm WARN rm not removing /Users/mammar/Documents/gatsby/site/tutorial-part-two/node_modules/@babel/preset-env/node_modules/.bin/browserslist as it wasn't installed by /Users/mammar/Documents/gatsby/site/tutorial-part-two/node_modules/@babel/preset-env/node_modules/browserslist
npm WARN rm not removing /Users/mammar/Documents/gatsby/site/tutorial-part-two/node_modules/.bin/babylon as it wasn't installed by /Users/mammar/Documents/gatsby/site/tutorial-part-two/node_modules/babylon
npm WARN rm not removing /Users/mammar/Documents/gatsby/site/tutorial-part-two/node_modules/babel-template/node_modules/.bin/babylon as it wasn't installed by /Users/mammar/Documents/gatsby/site/tutorial-part-two/node_modules/babel-template/node_modules/babylon
npm WARN rm not removing /Users/mammar/Documents/gatsby/site/tutorial-part-two/node_modules/@babel/generator/node_modules/.bin/jsesc as it wasn't installed by /Users/mammar/Documents/gatsby/site/tutorial-part-two/node_modules/@babel/generator/node_modules/jsesc
npm WARN react-typography@0.16.13 requires a peer of react@^0.14.0 || ^15.0.0 || ^16.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN gatsby-plugin-typography@1.7.19 requires a peer of gatsby@^1.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN gatsby-starter-hello-world@ No repository field.
+ react-typography@0.16.13
+ typography@0.16.17
+ gatsby-plugin-typography@1.7.19
added 11 packages from 6 contributors, removed 1454 packages, updated 6 packages and audited 34 packages in 22.085s
found 0 vulnerabilities
Steps to reproduce
gatsby new tutorial-part-two https://github.com/gatsbyjs/gatsby-starter-hello-world#v2cd tutorial-part-twonpm install --save gatsby-plugin-typography react-typography typographygatsby develop
Expected result
gatsby should start the built-in development server
Actual result
error There was a problem loading the local develop command. Gatsby may not be installed. Perhaps you need to run "npm install"?
Environment
System:
OS: OS X El Capitan 10.11.5
CPU: x64 Intel(R) Core(TM) i5-5257U CPU @ 2.70GHz
Shell: 5.0.8 - /bin/zsh
Binaries:
Node: 8.11.3 - ~/.nvm/versions/node/v8.11.3/bin/node
Yarn: 1.3.2 - /usr/local/bin/yarn
npm: 6.1.0 - ~/.nvm/versions/node/v8.11.3/bin/npm
Browsers:
Chrome: 67.0.3396.99
Safari: 9.1.1
npmPackages:
gatsby-plugin-typography: ^1.7.19 => 1.7.19
npmGlobalPackages:
gatsby-cli: 1.1.58
File contents (if changed)
gatsby-config.js:
module.exports = {
plugins: [`gatsby-plugin-typography`],
}
package.json:
{
"name": "gatsby-starter-hello-world",
"description": "Gatsby hello world starter",
"license": "MIT",
"scripts": {
"develop": "gatsby develop",
"build": "gatsby build",
"serve": "gatsby serve"
},
"dependencies": {
"gatsby": "next",
"gatsby-plugin-typography": "^1.7.19",
"react": "^16.3.2",
"react-dom": "^16.3.2",
"react-typography": "^0.16.13",
"typography": "^0.16.17"
}
}
gatsby-node.js: N/A
gatsby-browser.js: N/A
gatsby-ssr.js: N/A
About this issue
- Original URL
- State: closed
- Created 6 years ago
- Reactions: 6
- Comments: 40 (16 by maintainers)
Anyone who has stumbled up upon this issue DO NOT USE
npmUSEyarn, don’t waste your time!@muhammad-ammar My hunch is that you may have unsatisfied peer dependencies, could you try running
npm installafter and seeing if that works?Are there any specific warnings given when running
npm install --save gatsby-plugin-typography react-typography typography?Something this major still not fixed? This is in the Gatsby tutorial - every developer who tries to learn Gatsby is going to stumble over this. And being new to Gatsby and relatively new to React, the “fixes” above just confuse me. I don’t really want to start down a rabbit hole of trying to fix broken tutorials and dependency and yarn/npm hell when I don’t fully understand what/why. What a nightmare! Can Gatsby be used to develop real apps?
As noted above, the steps indicated in the tutorial at: https://www.gatsbyjs.org/tutorial/part-two/ are:
Do I just use yarn instead of npm in the above command? Is the rest of the command line the same? Is the rest of the tutorial going to work? Should I revert to the previous gatsby version? How? It’s pretty bad if hello world doesn’t work!
Is the solution to this really to switch from
npmtoyarn? Seems like that’s just a workaround that might not always be desirable since it can probably cause issues for some people.Hi @Chuloo, I switched to
yarnand it solved the issue. Instead ofnpm install --save gatsby-plugin-typography react-typography typography, executeyarn add gatsby-plugin-typography react-typography typography.But this is not good as I still don’t know why the
npmis not working and why theyarnis working?I did that and the next issue with a missing module ‘detect-libc’ …
After spending the afternoon on this issue, I (randomly) tried to build using
yarninstead ofnpmand it worked. My gatsby setup was repaired, even on a fresh docker node:8 image without python (only git).The typography package installation worked with yarn while it has been a nightmare with npm.
This is a good news but also a bad, because I have a new build system to learn with yarn.
I’d advise to update this page of the tutorial : https://www.gatsbyjs.org/tutorial/part-three/ by replacing the command
npm install --save gatsby-plugin-typography react-typography typographyto the yarn equivalentyarn add gatsby-plugin-typography react-typography typographyThanks you @DanielRuf for the help 😃
This could be due to a mix of using Gatsby v2 with Gatsby v1 plugins. If that’s the case, we should probably update the docs to make it clear how and when to install v2 plugins.
Just ran into the same issue working on Gatsby v2. Why can’t this be fixed?
Thank you man, works for me! 😃
Good to note that using this starter
https://github.com/gatsbyjs/gatsby-starter-default#v2doesn’t throw an error. This doeshttps://github.com/gatsbyjs/gatsby-starter-hello-world#v2Here’s a reproduction.Hello, I’m discovering Gatsby through the tutorials and I’m also stuck with that issue, I do not understand why it is marked as Closed. After spending hours on it I deleted my node_modules folder and tried npm install. Then I had to solve issues with the python executable during npm install and now I’m still stuck with a shady npm error "Cannot find module ‘detect-libc’. Should it be added to the dev dependencies ?
Why the hell is it so complicated to get things working ? 100% agree with @ericsolberg…
I’m in the same boat, keep getting errors “Can’t resolve 'gatsby-link” when trying to start up hello world tutorials. Really keen to look into it, but am struggling to get it of the ground. Surely the starting point should be solid. I’ve spent over a day trying to track down why.
Should Gatsby v1 be used instead?
We do cover this in the migration guide:
https://next.gatsbyjs.org/docs/migrating-from-v1-to-v2/#update-gatsby-related-packages
I’m on a Windows 10 PC running a Laravel Homestead Vagrant Ubuntu VM, where I’ve been installing the tutorial. (So I also had to map port 8000 to 8000 in Homestead.yaml.)
I’m trying to learn Gatsby. I skipped to https://www.gatsbyjs.org/tutorial/part-four/#data-in-gatsby (but then went back to parts 1-3 and had similar problems).
It’s surprising that the tutorials don’t work, as people have said above.
Finally, after finding this issue/ticket, I was able to get things working by using
yarninstead ofnpm:I now am able to see pandas at http://localhost:8000/
I think someone should update the docs to prevent new people wanting to learn Gatsby from wasting a lot of time being frustrated not even getting the tutorial to load.
But overall, thanks for the very good looking tutorial and a framework that looks very promising.
@KyleAMathews sorry I missed that in the docs Kyle. That makes more sense but I didn’t even look at the migrating guide, I just started with the V2 docs tutorial and that’s where the confusion comes from as there is not mention of the
@nexttag in there.I had a lot of similar issues recently and also found that running yarn as the package manager would sort most of this out - but it didn’t solve the actually issue everyone is talking about.
The problem many of you are having is that you are installing the V2 starters but not V2 plugins or Gatsby V2 which then causes these issues (I know this as I have installed everything more times than I can count in the last 3 days).
For example you need to make sure when you install
gatsby-clithat you actually install it asgatsby-cli@nextif you are wanting to use V2 starters - the@nexttag makes sure you are installing the latest versions I believe - so then the same with the plugins. For example I wanted to use Sass so installedgatsby-plugin-sass@nextalong with thenode-sassdependency and it solved the issues above.For me this could be fixed by updating the docs to specify that you need to use the
@nexttag as nowhere does it make this clear.Failed with the same error as before on next and master however
gatsby infoleads to some really interesting results.Before I install the plugin, my important gatsby info looks like this:
After installing:
After uninstalling using
npm remove --save gatsby-plugin-typographyI get info identical to as before installation, but the real interesting part is when I reinstall it usingnpm install --save gatsby-plugin-typography@nextwhich gives me the following:It’s also worth noting that
gatsby developfunctions properly after the reinstallation.