Question

我有一个带.ts文件的Typescript项目，该文件正在导出一些接口和一个类。与此类似：

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...]
}

现在我构建项目（使用基本的tsc命令-ES2015模块作为目标），并且在/ dist中将有一个.d.ts文件和一个.js文件。

在.js文件中，当然不再有任何接口。看起来像这样：

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

在.d.ts文件中，我具有所有接口以及该类的声明，例如：

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

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

到目前为止，一切都很好-一切都很好。

现在，我将包（/ dist文件夹）安装到另一个项目中，并且真的很想在那使用我的界面。所以我正在这样做：

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

const myTree: Tree = {someTreeObject}

但是Typescript会告诉我“不能使用名称空间'Tree'作为类型”-为什么使用名称空间？

另一种尝试：

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

const myTree: Stuff.Tree = {someTreeObject}

但是Typescript会告诉我“命名空间'“ *”'没有导出的成员'Tree'。”

然后，我查看了其他一些Typescript声明，并以为“也许您需要使用名称空间”（也听起来像是这样的错误），所以我将myFile更改为：

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...]
  }
}

尝试import {myFile} from "myPackage/dist/myFile"我将得到一个很棒的“名称空间”“ *”'，它没有导出的成员'Tree'。”再次出错。

有人可以告诉我这是怎么回事吗？我想这确实很容易，但是我不明白。

这是复制品仓库： https://github.com/schadenn/typescript-problem-repro
您可以自己npm run build或只是npm install .tgz软件包，然后尝试import { NavUtils, TsUtils } from "@test/utils"并使用NavUtils.ITree或TsUtils.Omit<ITree, "label">。我还签入了dist文件夹，以便您可以查看软件包的内容。

谢谢

Answer 1

找不到您的类型，因为该软件包当前在types中使用了错误的package.json路径。您可以像这样更改types字段：

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

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

因此它与您在tsconfig.json中为类型声明发射设置的目录匹配：

"declarationDir": "dist/types"

如果您想直接使用软件包ITree中的接口@test/utils，可以re-export个成员。像这样更改您的src/index.ts：

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

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

在客户端中，您将能够编写：

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

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

关于Namespaces：我认为，您不需要在这里使用它们：

命名空间在全局命名空间中只是命名为JavaScript对象。 [...] 命名空间是在Web应用程序中构建代码的一种好方法，所有依赖项都包含在HTML页面中的 script标签中。

从.d.ts文件导出“混合”声明-Typescript

1 个答案: