如何爲退出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定義文件

回答

相關問題