クラスをエクスポートするNPMモジュールにタイスクリプトのタイピングを追加するにはどうすればよいですか？

Question

私のdesign-systems-utilsモジュールは、ソースコードがTypescriptを使って書かれていなくてもTypescriptの型を含めることを望みます。

私はすでにhereを試みましたが、動作しません。ちなみに、私のモジュールはクラスをエクスポート...

declare class DesignSystem { 
    constructor(system: object, options?: object); 
    multiply(initial: number, multiplier: number): any; 
    get(val: string): any; 
    bp(bp: string): any; 
    z(z: string): any; 
    fontSize(size: string|number, toPxl?: boolean): string; 
    fs(size: string|number, toPxl?: boolean): string; 
    spacing(index: number): string; 
    space(index: number): string; 
    toPx(value: number, base: number, unit?: string): string; 
    pxTo(value: number, base: number): string; 
    color(hue:string, value:string): string; 
    designSystem: object; 
    interface options { 
     defaultUnit: string, 
     useModularScale: boolean, 
     fontSizeUnit: string 
    } 
} 

私もそうのように、私はモジュールとしてこれをエクスポートする必要があることを見てきました：

declare module "DesignSystem" { 
    export default class DesignSystem { 
     constructor(system: object, options?: object); 
     /*~ Multiply two items together */ 
     multiply(initial: number, multiplier: number): any; 
     get(val: string): any; 
     bp(bp: string): any; 
     z(z: string): any; 
     fontSize(size: string|number, toPxl?: boolean): string; 
     fs(size: string|number, toPxl?: boolean): string; 
     spacing(index: number): string; 
     space(index: number): string; 
     toPx(value: number, base: number, unit?: string): string; 
     pxTo(value: number, base: number): string; 
     color(hue:string, value:string): string; 
     designSystem: object; 
    } 
} 

しかし、また、動作しないこと。

ご協力いただければ幸いです。原則として

Answer 1

：

declare module "DesignSystem" { ...} 

があなたのNPMモジュールの名前に変更する必要があります。

declare module "design-systems-utils" { ...} 

これは、あなたが「ここで、ユーザがないときのためにタイプ 'はtypescriptですを伝える方法ですimport ... from design-systems-utils '"のようになります。これは、ライブラリタイプを「外側」から拡張する必要がある場合に最も役立ちます。

ただし、package.jsonにはtypes: src/index.d.tsフィールドがあるので、それも必要ありません。 Typescriptは既にあなたのd.tsファイルがどのライブラリを定義しているかを知っています。

export default class DesignSystem {...} 

で十分です。

初めての試みでは、というグローバルクラスがDesignSystemと宣言されています。一般的な経験則では、d.tsはjs構造をミラーリングする必要があります。あなたは、JSファイルからexport defaultを行うd.ts

（また、あなたのライブラリーの定義を提供するためのおかげで、あなたは世界をより良い場所にする）