如何在 TypeScript 中导入默认导出类型？

Question

I want to declare window.lottie with the below code.

// node_modules/lottie-web/index.d.ts
type LottiePlayer = {
    play(name?: string): void;
    stop(name?: string): void;
    setSpeed(speed: number, name?: string): void;
    setDirection(direction: AnimationDirection, name?: string): void;
    searchAnimations(animationData?: any, standalone?: boolean, renderer?: string): void;
    loadAnimation(params: AnimationConfigWithPath | AnimationConfigWithData): AnimationItem;
    destroy(name?: string): void;
    registerAnimation(element: Element, animationData?: any): void;
    setQuality(quality: string | number): void;
    setLocationHref(href: string): void;
};

declare const Lottie: LottiePlayer;

export default Lottie;

//src/type.d.ts
import Lottie from 'lottie-web';

declare interface Window {
  lottie: Lottie;
}

But there is an error.

TS2749: 'Lottie' refers to a value, but is being used as a type here.

So how to import default export type in TypeScript?

Answer 1

declare const Lottie:LottiePlayer tells us that module lottie-web exports an object of type LottiePlayer , not a type.

It looks like you really want window.lottie to be of type LottiePlayer .

The type LottiePlayer is not explicitly exported from lottie-web . However, using the typeof keyword, we can sidestep this as follows:

import Lottie from 'lottie-web';

declare interface Window {
  lottie: typeof Lottie; //LottiePlayer
}