如何爲npm模塊創建聲明？

Question

我無法弄清楚如何爲特定的npm模塊創建一個聲明。即bbcode-to-react。

主文件表示爲index.js和只有一點點代碼：

'use strict'; 

var _parser = require('./parser'); 

var _parser2 = _interopRequireDefault(_parser); 

var _tag = require('./tag'); 

var _tag2 = _interopRequireDefault(_tag); 

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } 

module.exports = new _parser2.default(); 
module.exports.Parser = _parser2.default; 
module.exports.Tag = _tag2.default; 

兩個「./parser」和「./tag」包含我需要的類。

我無法從打字稿文檔中找出如何在d.ts文件中聲明/導出這個設置。我能找到的與module.exports相關的最好的東西都是關於導出一個類或函數，但我需要解析器和標記類。

Answer 1

這裏是打字bbcode-to-react：

declare module 'bbcode-to-react' { 
    import * as React from 'react'; 

    function toReact(input: string): JSX.Element; 
    function registerTag(name: string, tag: typeof Tag): void; 

    class Tag { 
     name: string; 
     parent: JSX.Element; 
     text: string; 
     params: { [index: string]: any }; 
     children: JSX.Element[]; 

     getComponents(): JSX.Element; 
     getContent(raw?: boolean): string; 
     toText(contentAsHTML?: boolean): string; 
     toHTML(): string; 
     toReact(): JSX.Element; 
    } 
} 

把這個代碼bbcode-to-react.d.ts文件中。

請確保您有@types/react和@types/react-dom使用此類型安裝

一個例子：

import * as React from 'react'; 
import * as parser from 'bbcode-to-react'; 
import { Tag } from 'bbcode-to-react'; 
import { renderToString } from 'react-dom/server'; 

const Example1 = (props: any) => { 
    return (
     <p>{parser.toReact('[b]strong[/b]')}</p> 
    ); 
} 

console.log(renderToString(<Example1 />)); 

class YoutubeTag extends Tag { 
    toReact() { 
     const attributes = { 
      src: this.getContent(true), 
      width: this.params.width || 420, 
      height: this.params.height || 315, 
     }; 
     return (
      <iframe 
       {...attributes} 
       frameBorder="0" 
       allowFullScreen 
      /> 
     ); 
    } 
} 

class BoldTag extends Tag { 
    toReact() { 
     return (
      <b>{this.getComponents()}</b> 
     ); 
    } 
} 

parser.registerTag('youtube', YoutubeTag); 
parser.registerTag('b', BoldTag); 

const Example2 = (props: any) => { 
    return (
     <p>{parser.toReact('[youtube width="400"]https://www.youtube.com/embed/AB6RjNeDII0[/youtube]')}</p> 
    ); 
} 

console.log(renderToString(<Example2 />));