TypeScript can't find Slider

[sidonaldson]

TYPESCRIPT - yay.

I'm currently required to use TS in my project but I can't seem to find any documentation about it.

in node_modules/@types/react-slick there is a definition file which seems to extend React.Component and export Slider

export default Slider;

but Slider isn't available as a namespace or an interface.

Can anyone offer any insight into getting this working? Thanks!

[oxodesign]

Did you install @types/react-slick ? (Additional NPM package)

[sidonaldson]

@oxodesign yup

The only way I could get this to work is to import the typings into my own typings file, which in turn then need to be imported because TS treats it as a module.

i.e.

import { Settings as CarouselSettings } from 'react-slick';

interface CarouselProps {
    carouselSettings?: CarouselSettings;
    children?: React.ReactChild[];
}

[john20xdoe]

Another variation to get this to work, after installing @types/react-slick in devDependencies:

in your .d.ts file:

import Slider, { Settings } from 'react-slick';
declare module 'react-slick' {
  export { Slider, Settings };
}

then import normally in your component.

import Slider, {Settings} from 'react-slick';

VS Code Go To Definition will now go correctly to the node_modules index.d.ts.

[sidonaldson]

@john20xdoe that is the answer I was looking for! Thanks

[nattri]

Do we have any update on this issue?

[Stophface]

Very annoying. In a TS Project its impossible to use with import Slider from "react-slick";

[alxvallejo]

@john20xdoe What .d.ts file?

[razvan-ct]

Does anybody manage to make this work in typescript recently ?