10
votes

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.

2
how did you create your react project? very unusual to get a typescript error like that unless you're using typescriptazium
I have created ASP.NET Core MVC app with React trough Visual Studio.Ryukote

2 Answers

22
votes

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"

3
votes

If you're using VS Code, there's a quick fix suggestion for this you can invoke with Ctrl + .

Install missing types

You can also automatically add all missing types with typesync like this:

npx typesync

If the package doesn't have it's own types, and it hasn't been added to DefinitelyTyped, you'll need to add a new definitions file

Further Reading