IT技术 - JSX 元素类型“CounterDisplay”不是 JSX 元素的构造函数。属性“refs”的类型不兼容 - 吾爱随笔录

我将typescript从 1.6 版更新为 2.1.6 版，并将对 15.0.15 版做出react的类型更新。如果我通过 gulp 或 tsc 编译typescript文件，一切正常并且没有错误消息。然而，Visual Studio 2017 RC 和 Sublime Text 抱怨typescript代码。

这是我的一些代码。这不会产生任何错误。

interface CounterDisplayProps {
    loading: boolean;
    first: number;
    last: number;
    total: number;
}

class CounterDisplay extends React.Component<CounterDisplayProps, {}> {
    render() {
        var { props } = this;
        return (
            <div className="Counter">
                Showing {props.first} to {props.total ? Math.min(props.last, props.total) : props.last} of {props.loading ? "?" : props.total} entries
            </div>
    )}
}

另一个组件的渲染函数包含：

<CounterDisplay 
    loading={props.counterIsLoading}
    first={props.skip + 1}
    last={props.skip + props.take}
    total={props.counter} />

上面的代码在 Visual Studio 2017 和 Sublime Text 中都产生了以下错误：

JSX element type 'CounterDisplay' is not a constructor function for JSX elements.
Types of property 'refs' are incompatible.
Type '{ [key: string]: ReactInstance; }' is not assignable to type '{
[key: string]: Component<any, any>; }'.
Index signatures are incompatible.
Type 'ReactInstance' is not assignable to type 'Component<any, any>'.
Type 'React.Component<any, any>' is not assignable to type 'React.Component<any, any>'. Two different types with this name exist, but they are unrelated.
Types of property 'refs' are incompatible.
Type '{ [key: string]: ReactInstance; }' is not assignable to type '{
[key: string]: Component<any, any>; }'.
Index signatures are incompatible.
Type 'ReactInstance' is not assignable to type 'Component<any, any>'.
Type 'React.Component<any, any>' is not assignable to type 'React.Component<any, any>'. Two different types with this name exist, but they are unrelated.

每当我使用我自己编写的 react 组件时，Visual Studio 和 Sublime Text 都会抱怨。我想知道为什么这段代码在使用编译器时有效，而在使用 IDE 时无效。你能帮助我吗？