question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Types TypeScript support

See original GitHub issue

Error using TypeScript.

TypeScript error in ./client/src/components/Clients/index.tsx(2,27):
Could not find a declaration file for module 'react-items-carousel'. ./client/node_modules/react-items-carousel/dist/react-items-carousel.js' implicitly has an 'any' type.
  Try `npm install @types/react-items-carousel` if it exists or add a new declaration (.d.ts) file containing `declare module 'react-items-carousel';`  TS7016
    1 | import React, { useState } from 'react'
  > 2 | import ItemsCarousel from 'react-items-carousel';
      |                           ^
    3 | // import '@brainhubeu/react-carousel/lib/style.css'
    4 | // import './Clietns.scss'
    5 | 

I recommend to you use dts gen created by Microsoft.

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Comments:6 (1 by maintainers)

github_iconTop GitHub Comments

1reaction
jeffersonalopescommented, Jan 10, 2022

@Jehangir-Wahid, thanks man, it works like a charm! You just save-me some hours!!

0reactions
Jehangir-Wahidcommented, Dec 21, 2021

Hi @Oluwasetemi and other guys,

I just came across this issue and is still not fixed. It can be fixed it by adding the react-items-carousel module manually. Just do the following in your React application.

  • Create a directory for your app types, named types, in the root directory of your application.
  • Create a sub-directory in the types directory, named react-items-carousel.
  • Create a file index.d.ts in the sub-directory, i.e. react-items-carousel, and your directory structure will be like
project
|___node_modules
|___public
|___src
|
|___types
   |
   |___react-items-carousel
      |   index.d.ts
  • Declare the carousel module in the file index.d.ts, like the following.

    declare module "react-items-carousel";

  • Now add your local types directory to the TypeScript configuration file tsconfig.json in the compilerOptions object.

  • Exclude the root directory you just created for your local types, so that it will not be compiled. Your tsconfig.json file will look like the following after adding these two.

{
  "compilerOptions": {
    ...
    "typeRoots": [ "./types", "./node_modules/@types" ],
  },
  "exclude": [ "node_modules", "types" ],
  ...
}

And that’s all, you are good to go to use the react-items-carousel module with TypeScript support.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Handbook - Basic Types
In TypeScript, we support the same types as you would expect in JavaScript, with an extra enumeration type thrown in to help things...
Read more >
Documentation - Advanced Types
This page lists some of the more advanced ways in which you can model types, it works in tandem with the Utility Types...
Read more >
TypeScript: JavaScript With Syntax For Types.
TypeScript extends JavaScript by adding types to the language. TypeScript speeds up your development experience by catching errors and providing fixes ...
Read more >
Documentation - Everyday Types
JavaScript has three very commonly used primitives: string , number , and boolean . Each has a corresponding type in TypeScript. As you...
Read more >
Documentation - Utility Types
TypeScript provides several utility types to facilitate common type transformations. These utilities are available globally.
Read more >

github_iconTop Related Medium Post

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found