【问题标题】:Circular Type References in TypeScriptTypeScript 中的循环类型引用
【发布时间】:2014-08-18 03:03:51
【问题描述】:

我是打字稿的新手,我想了解如何在两种类型之间设置循环引用。参考不必是完整的代码参考,只需接口,而是在单独的文件中定义接口。例如,假设我有两个接口:Parent 和 Child。它们是双重链接的,这样父级有一组子级,每个子级都有对父级的引用(如下所示)。如何设置导入或依赖项,以便可以在单独的文件中定义它们?

interface Parent {
  children: Child[]
}

interface Child {
  parent: Parent
}

【问题讨论】:

  • 我会亲自将它们放在同一个文件中,因为它们有着千丝万缕的联系,并且在编译过程中都会被删除。
  • 解决循环依赖的方法参考这个问题:stackoverflow.com/a/62742533/3198983

标签: typescript


【解决方案1】:

我也遇到过类似的情况。

我可以使用import type解决。

https://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-8.html

【讨论】:

  • 这正是我所需要的,非常感谢!
  • 一个非常优雅和快速的修复。我尝试始终跟上 TS,但错过了这个 TS3.8 功能。描述淡化了它的有用性并没有帮助:This feature is something most users may never have to think about; however, if you’ve hit issues under isolatedModules, TypeScript’s transpileModule API, or Babel, this feature might be relevant.
【解决方案2】:

以下两种解决方案。我更喜欢后者,因为它提供了与 Node JS 模块的干净接口,但不幸的是,我的 IDE(尚未)像我一样喜欢它......

使用参考

创建一个definitions.d.ts 文件,该文件将只包含对您的类/接口的引用

/// <reference path="Parent.ts" />
/// <reference path="Child.ts" />

Parent.tsChild.ts 中,指向单个引用,definitions.d.ts 文件

/// <reference path="definitions.d.ts" />

使用导入...要求

--module commonjs 标志传递给tsc,然后将import 传递给requireexport 你想要公开的内容

在 Parent.ts 中

 import Child = require('Child')

 interface Parent { 
     children: Child[]
 }

 export = Parent

在 Child.ts 中

 import Parent = require('Parent')
 
 interface Child {
     parent: Parent
 }

 export = Child

请注意,您没有在require 中指定扩展名“.ts”

【讨论】:

  • 您在 2016 年 9 月的编辑(仍然)使用 typescript 生成循环依赖消息:>=2.4.2
  • @BernoulliIT 我删除了 2016 年的编辑,它不再适用于最新版本的打字稿。上面的“解决方案”仍然是解决方法——重新设计可能是一个更好的主意
  • @BrunoGrieder 什么样的“重新设计”。对于强类型语言,循环是正常且预期的行为!
【解决方案3】:

我有大约 10 个 ts 文件,位于循环依赖地狱中。

常用的方法已经帮不了我了,因为10个文件之间的依赖关系太复杂了。

终于,我解决了。使用以下两种方法:

  1. 安装repo————“循环依赖插件”:“5.0.2”

    这个 repo 将帮助我找到循环发生的地方。

  2. 使用设计好的 internal.ts 来管理我的导入和导出

    我试过这篇文章的方法:

    How to fix nasty circular dependency issues once and for all in JavaScript & TypeScript

    这篇精彩的文章告诉我创建 internal.ts 。

    并使用export * form 'file-A' ; export * from 'file-B' 来管理我的循环依赖项。

    当我使用与我的 10 个文件相关的依赖项时,它工作得很好,例如 import classA from '../internal.ts'

————————————————————————————————————

如果上面的方法对你没有效果,我找到了另一种通用的解决方案:

使用

const File_Promise = import ('yourFilePath')" 导入其他文件或模块。

当你需要使用这个时,使用

File_Promise.then (file =&gt; { file.xxx(file.yyy) }) ,就像使用 Promise 语法一样。 `

这将破坏循环深度链!

如果我是你,我将继续此操作,直到“循环依赖插件”报告没有错误。

————————————————————————————————————

希望能帮到你!

【讨论】:

  • 我应用了相同的方法,但我仍然收到类似 src/app/shared/entities/internal.ts > src/app/shared/entities/calender-event.entity.ts src/ 的依赖警告app/shared/entities/internal.ts > src/app/shared/entities/contact.entity.ts 6) src/app/shared/entities/internal.ts > src/app/shared/entities/email-template.entity .ts 7) src/app/shared/entities/internal.ts > src/app/shared/entities/goal.entity.ts @Lancer.Yan
  • @Sanam 我找到了一个通用的解决方案。使用“const File_Promise = import('yourFilePath')”,当需要使用原File的功能时,使用File_Promise.then(file => {}),就像使用Promise语法一样。
猜你喜欢
  • 1970-01-01
  • 2018-07-03
  • 2020-12-09
  • 1970-01-01
  • 1970-01-01
  • 2021-08-18
  • 1970-01-01
  • 2018-01-16
  • 2021-12-30
相关资源
最近更新 更多