如何为退出JavaScript编写Typescript定义文件

我想在我的打字稿项目中使用JavaScript编写的React组件https://github.com/alexkuz/react-json-tree 。如何为退出JavaScript编写Typescript定义文件

的使用是根据该示例中的Javascript很简单：

import JSONTree from 'react-json-tree' 

// Inside a React component: 
const json = { 
    array: [1, 2, 3], 
    bool: true, 
    object: { 
    foo: 'bar' 
    } 
} 

<JSONTree data={json} />

才拿到这个样本运行我写道：

/// <reference path="../ambient/react/index.d.ts" /> 

declare namespace ReactJsonTree{ 
    interface JSONTreeProps{ 
     data: any; 
    } 

    class JSONTree extends __React.Component<JSONTreeProps, void>{} 
} 

declare module "react-json-tree" { 
    export = ReactJsonTree; 
}

编撰现在的作品，但是，用它作为

import {JSONTree} from "react-json-tree"; 
... 
<JSONTree data={somedata} />

我得到运行时错误：

SCRIPT5022：元素类型无效：预期为字符串（对于内置组件）或类/函数（对于复合组件），但得到：未定义。检查Index的渲染方法。

警告：React.createElement：类型不应该为null，undefined，boolean或number。它应该是一个字符串（用于DOM元素）或ReactClass（用于复合组件）。检查Index的渲染方法。

我是一个新的写现有的JavaScript库的定义类型。

所以任何人都可以给我一个有用的建议吗？

来源

2016-05-15 Matthias

我需要一个定义为react-json-tree以及我重新创建了您的错误消息。在我开始之前，如果你有任何进展，我很好奇。 –

我能够复制您的错误信息。我不认为你的导出是正确的，当你导入它时JSONTree是未定义的（被运行时错误信息所暗示）。

我没有得到它与this工作正在进行定义工作：

declare namespace ReactJsonTree { 

    interface JSONTreeProps{ 
     data: any; 
     hideRoot?: boolean; 
     invertTheme?: boolean; 
     theme?: any | string; 
    } 

    class JSONTree extends React.Component<JSONTreeProps, any> {} 
} 

declare module "react-json-tree" { 
    export default ReactJsonTree.JSONTree; 
}

而且由于它是一个default出口我然后导入它像this：

import JSONTree from "react-json-tree"; 

// ... 

<JSONTree data={this.props.logs} />

来源

2016-10-24 23:00:33

如何为退出JavaScript编写Typescript定义文件

回答

相关问题