Could not find a declaration file for module 'gatsby-plugin-dark-mode'

user_18128228 0
Viewed 368

I'm getting the below error, trying to import ThemeToggler from gatsby-plugin-dark-mode

module "C:/Users/Karim Elnemr/Desktop/my-gatsby-website/node_modules/gatsby-plugin-dark-mode/index"
Could not find a declaration file for module 'gatsby-plugin-dark-mode'. 'C:/Users/Karim Elnemr/Desktop/my-gatsby-website/node_modules/gatsby-plugin-dark-mode/index.js' implicitly has an 'any' type.
  Try `npm i --save-dev @types/gatsby-plugin-dark-mode` if it exists or add a new declaration (.d.ts) file containing `declare module 'gatsby-plugin-dark-mode';`ts(7016)

also I'm getting this errors on the terminal for ever I try to install the blugin

npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: gatsby-starter-hello-world@0.1.0
npm ERR! Found: react@17.0.2
npm ERR! node_modules/react
npm ERR!   react@"^17.0.1" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react@"16.x" from gatsby-plugin-dark-mode@1.1.2
npm ERR! node_modules/gatsby-plugin-dark-mode
npm ERR!   gatsby-plugin-dark-mode@"^1.1.2" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!

down below is where I imported the said plugin

import React from "react"
import { ThemeToggler } from "gatsby-plugin-dark-mode"

export default function ThemeToggle() {
  return (
    <ThemeToggler>
      {({ theme, toggleTheme }) => {
        if (theme == null) {
          return null
        }
        return (
          <label className="theme-switch">
            <input
              type="checkbox"
              onChange={e => toggleTheme(e.target.checked ? "dark" : "light")}
              checked={theme === "dark"}
            />
            <span className="toggle"></span>
          </label>
        )
      }}
    </ThemeToggler>
  )
}

need some explanation what dose it mean and why it's happening so I can solve it.

npm reactjs node.js
3 Answers

The error on the install means that the library you want to install depends on react 16 while you have React 17 installed on your project

you can use this command npm i gatsby-plugin-dark-mode --legacy-peer-deps

user_65813030

You need to downgrade your react versions: in your package.json

   "dependencies": {
   ...
   "react": "16.14.0",
    "react-dom": "16.14.0",
    ...
    }

Then delete your node-modules folder and run

yarn install or npm install
user_92515420

You can simply do : npm i gatsby-plugin-dark-mode --force

user_135606950
Related