Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Typescript: Could not find a declaration file for module 'react-cards'

I am totally new to ReactJS and I found myself stuck in the next thing. I have installed react-cards via npm like this:

npm install --save react-cards

Installation was ok and I want to import it in my code like this:

import Card from 'react-cards';

But then I got error saying this:

Could not find a declaration file for module 'react-cards':'path' implicitly has an 'any' type. Try 'npm install @types/react-cards' if it exists or add a new declaration(.d.ts) file containing 'declare module 'react-cards';'.

I have tried with npm install @types/react-cards but nothing changed.

I don't know what to do.

like image 221
Ryukote Avatar asked May 27 '18 19:05

Ryukote


People also ask

Could not find a declaration file for module react JSX?

When you have this error, it is usually because you installed a library and you didn't install the types of that library. To fix this error, you need to install @types/library-name using your package manager (npm or yarn). Save this answer.

Could not find a declaration file for module js file?

If you are getting the "Could not find a declaration file for module 'X'" error when trying to import JavaScript files into your TypeScript files, you have to set the allowJs option to true in your tsconfig. json file.

How do I fix ts7016 error?

You can fix the error by writing typings yourself, or preferably by installing the types (if they do exist) using npm install --save-dev @types/react-native-material-color .

How do you fix error ts7016 could not find a declaration file for module XYZ file JS implicitly has an any type?

Try `npm install @types/XYZ` if it exists or add a new declaration (. d. ts) file containing `declare module 'XYZ'; If XYZ is a direct dependency of your project, you can follow the instructions from the error message and run npm install @types/XYZ .


1 Answers

You're importing an npm packages which lacks type information.

In your example, TypeScript doesn't understand the properties of Card when imported. TypeScript is not able to detect a type and refers to any, which essentially means untyped.

For many untyped packages there are @types npm packages which add those typings for you. You can find them here: microsoft.github.io/TypeSearch

Unfortunately, there's no @types/react-card package, but you have options:

  1. You could write the typing information for react-cards by yourself and save it into a react-cards.d.ts file.

  2. Disable the warning inside your tsconfig.json by setting "noImplicitAny": false - Reference : https://www.typescriptlang.org/docs/handbook/compiler-options.html

Further information: typescript github thread "Importing untyped JS modules"

like image 145
jantimon Avatar answered Sep 30 '22 04:09

jantimon