为react组件库添加typescript类型提示

以我自己的组件react-better-countdown为例,
首先在package.json里面添加types: types/index.d.tsimage.png
最后是index.d.ts文件的编写,具体看代码:

import * as React from 'react';

interface CountdownProps {
    count?: number;
    dayText?: string | React.ReactElement;
    hourText?: string | React.ReactElement;
    minuteText?: string | React.ReactElement;
    secondText?: string | React.ReactElement;
    callback?: Function;
    className?: string;
    style?: React.CSSProperties;
    rest?: any
}

interface CountdownState {
    count?: number;
}

declare module 'react-better-countdown' {
    export default class Countdown extends React.Component {
        state: CountdownState;
        timer: null | number;
        tick: () => void;
        componentDidMount(): void;
        componentDidUpdate(prevProps: CountdownProps): void;
        componentWillUnmount(): void;
        render: () => React.ReactElement;
    }
}

更多详细代码看仓库:https://github.com/leeseean/r...,顺便求个Star!

你可能感兴趣的:(前端,react.js,typescript)