时间戳

首页 > 解决方案 > 打字稿 | 如何避免命名空间和主库接口名称冲突？

typescript - 打字稿 | 如何避免命名空间和主库接口名称冲突？

问题描述

假设我正在用 javascript 编写一个带有 typescript 声明文件的库，并且我想通过接口创建库实例的“形状”，如下所示：

export interface Library {
  foo: string;
  bar: string;
}

现在假设fooand bartype 会更复杂，我想将它执行为不同的类型别名，例如：

export type ID = string | number;

export interface Library {
  foo: ID;
  bar: ID;
}

现在我想给出一些意义ID（因为“id”没有说明任何事情），我认为我能做到这一点的唯一方法是将它移动到不同的命名空间，它本质上应该被命名为库 - “图书馆”：

export namespace Library {
  export type ID = string | number;
}

export interface Library {
  foo: Library.ID;
  bar: Library.ID;
}

虽然它有效，但它令人困惑和模棱两可，因为一个导入将同时是两个不同的东西

我该如何解决这个问题？也许一些命名技巧？

标签： typescriptnaming

解决方案

这没有什么问题：

export type ID = string | number;

export interface Library {
  foo: ID;
  bar: ID;
}

请记住，您的库中的所有内容都必须从您的库中显式导入才能使用。当你这样做时，如果这对正在执行导入的代码很重要，你可以重命名导入。

import { Library, ID as LibraryID } from 'library'

// Locally defined ID that is different somehow
interface ID = { _id: number, cacheKey: string } // or whatever

const localId: ID = { _id: 123, cacheKey: 'qwerty' }
const libId: LibraryID = 123

在大多数打字稿代码编辑器中，您可以 cmd/ctrl 单击类型以跳转到该定义。这将跳转到您的库，并且很清楚类型来自何处。

大多数高调库不会在任何命名空间中隐藏它们的类型。例如：

import { Reducer } from 'react'

React 不在乎你是否有其他名为Reducer. 但如果这样做，您可以轻松地在您自己的文件中更改其本地名称，如上所述。

TL;DR：我认为您正在尝试解决一个实际上并不存在的问题。

推荐阅读