Exportera "blandade" deklarationer från .d.ts-fil - Typescript

Jag har ett Typescript-projekt med en .ts-fil som exporterar vissa gränssnitt och en klass. Liknande detta:

export interface Tree {
  value: string,
  anotherValue: number,
  children: Tree[]
}

export class Utils {
  static adder(val1: number, val2: number): number {
    return val1 + val2;
  }
  [...blabla some static functions...]
}

Nu bygger jag projektet (med grundläggande tsc-kommandon - ES2015-moduler som mål), och i min /dist kommer det att finnas en .d.ts-fil och en .js-fil.

I .js-filen kommer det såklart inte finnas några gränssnitt längre. Så det ser ut så här:

export class Utils {
  static adder(val1, val2) {
    return val1 + val2;
  }
  [...some more static functions...]
}

Och i .d.ts-filen har jag alla mina gränssnitt och deklarationerna för klassen, som:

export interface Tree {
  value: string,
  anotherValue: number,
  children: Tree[]
}

export class Utils {
  static adder(val1: number, val2: number): number;
}

Hittills så bra - allt ser fantastiskt ut.

Nu installerar jag mitt paket (/dist-mapp) i ett annat projekt och skulle verkligen vilja använda mina gränssnitt där. Så jag gör så här:

import {Tree} from "myPackage/dist/myFile"

const myTree: Tree = {someTreeObject}

Men Typescript kommer att säga "Kan inte använda namespace 'Tree' som en typ" - varför namespace?

Ett annat försök:

import * as Stuff from "myPackage/dist/myFile"

const myTree: Stuff.Tree = {someTreeObject}

Men Typescript kommer att säga till mig "Namespace '*' har ingen exporterad medlem 'Tree'."

Sedan kollade jag på några andra Typescript-deklarationer och tänkte "kanske behöver du använda ett namnrymd" (felmeddelandena låter också som det), så jag ändrade myFile till:

export declare namespace myFile {
  interface Tree {
    value: string,
    anotherValue: number,
    children: Tree[]
  }

  class Utils {
    static adder(val1: number, val2: number): number {
      return val1 + val2;
    }
    [...blabla some static functions...]
  }
}

Försöker att import {myFile} from "myPackage/dist/myFile" kommer jag att hamna med det stora "Namespace '"*"' har ingen exporterad medlem 'Tree'." felet igen.

Kan någon berätta för mig vad som går fel här? Jag antar att det är något väldigt enkelt, men jag förstår det bara inte.

Här är ett reproduktionsrepo: https://github.com/schadenn/typescript-problem-repro
Antingen kan du npm run build det själv eller bara npm install .tgz-paketet och försöka import { NavUtils, TsUtils } from "@test/utils" och använda NavUtils.ITree eller TsUtils.Omit<ITree, "label">. Jag har också checkat in dist-mappen så att du kan se innehållet i paketet.

Tack

Svar #1

Dina typer kan inte hittas, eftersom paketet för närvarande använder en felaktig types-sökväg i package.json. Du kan ändra types-fältet på detta sätt:

// from
"types": "dist/esm/index.d.ts"

// to
"types": "dist/types/index.d.ts"

Så det matchar katalogen du hade ställt in för typpåståendegenereringar i tsconfig.json:

"declarationDir": "dist/types"

Om du vill använda gränssnittet ITree från paketet @test/utils direkt, kan du exportera om dina medlemmar. Ändra din src/index.ts så här:

// from
import * as NavUtils from "./NavigationUtils";
export { NavUtils };

// to
export * from "./NavigationUtils";

I en klient kommer du då att kunna skriva:

import { ITree } from "@test/utils";

// use your interface here
declare const myTree: ITree;

När det gäller namnområden: Jag tror att du inte behöver använda dem här:

Namespaces är helt enkelt namngivna JavaScript-objekt i det globala namnområdet. [...] Namespaces kan vara ett bra sätt att strukturera din kod i en webbapplikation, med alla beroenden inkluderade som script-taggar i din HTML-sida.