13

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.

3
  • how did you create your react project? very unusual to get a typescript error like that unless you're using typescript Commented May 27, 2018 at 19:47
  • I have created ASP.NET Core MVC app with React trough Visual Studio. Commented May 27, 2018 at 20:07
  • See Also: Could not find a declaration file for module 'module-name' Commented Nov 3, 2020 at 4:44

2 Answers 2

26

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"

Sign up to request clarification or add additional context in comments.

6 Comments

So basically if I understand you well, I have decided to work with a package that I can't work with. If I do step 2 I will then get an errors for next 2 lines: import React from 'react'; import ReactDom from 'react-dom'; Sorry, but I am having a strugle working with code tags :)
I guess that would be a new question :)
The only thing left I could try is the first thing you have mentioned, but since I am React/Javascript/Typescript newb I really don't have a clue what to do with that.
Did you install @types/react and @types/react-dom ?
I am in another movie now. I will check it out when I get home.
|
4

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

1 Comment

This did it for me. Installing in manually did not work, but having VS Code auto install it worked. Thank you!

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.