Gatsby: Error: Unable to find plugin "gatsby-plugin-typography" in Gatsby.js Tutorial Part Two

[okamuuu]

Problem

I tried Gatsby.js Tutorial Part Two but I found the error message.

my environment

% node -v
v8.1.0

% sw_vers
ProductName:    Mac OS X
ProductVersion: 10.12.6
BuildVersion:   16G29

How to reproduce

I typed the following commands.

% cd 
% npm install --global gatsby-cli
% gatsby --version
1.1.6
% gatsby new tutorial-part-two https://github.com/gatsbyjs/gatsby-starter-hello-world
% cd tutorial-part-two

At this point, I can run the gatsby develop. But I found the error message when I create the gatsby-config.js.

% cat << EOT > gatsby-config.js
module.exports = {
  plugins: ["gatsby-plugin-typography"],
}
EOT

% npm install --save gatsby-plugin-typography 

the error

% npm run develop

> gatsby-starter-hello-world@ develop /Users/okamuuu/tutorial-part-two
> gatsby develop

success open and validate gatsby-config.js — 0.005 s
(node:76343) UnhandledPromiseRejectionWarning: Unhandled promise rejection (rejection id: 2): Error: Unable to find plugin "gatsby-plugin-typography"
(node:76343) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

Solution?

Looks like node_modules/gatsby is almost empty.

% ls -al node_modules/gatsby
total 0
drwxr-xr-x   3 okamuuu  staff   102  9  1 23:51 .
drwxr-xr-x  94 okamuuu  staff  3196  9  1 23:51 ..
drwxr-xr-x   3 okamuuu  staff   102  9  1 23:51 node_modules

So I tried to type npm install --save gatsby. It looks good to me.
Is npm install --save gatsby should be documented?

% ls node_modules/gatsby/
README.md       cache-dir       node_modules    yarn.lock
bin             dist            package.json

[KyleAMathews]

The NPM has a weird and very unfortunate bug of sometimes deleting large number of your modules in node_modules. The solution is to delete node_modules & package-lock.json and run npm install again.

[okamuuu]

I got it. Thank you for your correspondence:)

[NixLawrance]

not working :(
i tried the steps you mentioned

[jonniebigodes]

@NixLawrance i've ran the tutorial to this part and i could not reproduce your issue. No error is shown whatsoever and the content is shown as per tutorial. The only thing diferent i can probably have diferently is the package versions. My package.json has the following :

{
  "name": "gatsby-starter-hello-world",
  "description": "Gatsby hello world starter",
  "license": "MIT",
  "scripts": {
    "develop": "gatsby develop",
    "start": "npm run develop",
    "build": "gatsby build",
    "serve": "gatsby serve",
    "clear": "rimraf ./public && rimraf .cache",
    "pretty": "prettier --write \"src/**/*.{js,jsx}\""
  },
  "dependencies": {
    "gatsby": "^2.0.85",
    "gatsby-plugin-typography": "^2.2.4",
    "react": "^16.7.0",
    "react-dom": "^16.7.0",
    "react-typography": "^0.16.18",
    "typography": "^0.16.17",
    "typography-theme-bootstrap": "^0.16.7",
    "typography-theme-lawton": "^0.15.10"
  },
  "devDependencies": {
    "prettier": "^1.15.2",
    "rimraf": "^2.6.2"
  }
}

And my gatsby-config.js file has the following:

module.exports = {
    plugins: [
      {
        resolve: `gatsby-plugin-typography`,
        options: {
          pathToConfigModule: `src/utils/typography.js`,
        },
      },
    ],
  }

And here is a screenshot of the project running and my folder structure.

What i would like for you to do is, remove the folders .cache public and node_modules. Update the package versions reinstall and retry it. And provide some feedback later. Sounds good?

[reimertz]

I fixed this by applying the following diff

diff --git a/gatsby-config.js b/gatsby-config.js
index bff27e2..8aa4acf 100644
--- a/gatsby-config.js
+++ b/gatsby-config.js
@@ -59,7 +59,7 @@ module.exports = {
     {
       resolve: 'gatsby-plugin-typography',
       options: {
-        pathToConfigModule: '/src/utils/typography.js'
+        pathToConfigModule: './src/utils/typography.js'
       }
     },
     {
(END)

[tidiview]

I had the same problem after installing gatsby-plugin-styletron and deleting as explained by KyleAMathews solve the problem.