两个项目之间的跨项目引用

Question

是否可以在两个TypeScript项目之间进行引用？假设我们有以下项目结构：

Module1.ts包含：

module TestModule {
    export interface Interface1 {
    }
}

Module2.ts包含：

module TestModule {
    export interface Interface2 extends Interface1 {
    }
}

Test1中引用了

Test2。我在Could not find symbol 'Interface1'中收到错误Module2.ts。它在一个项目中工作，但我不知道如何从其他项目中看到它......也许现在不可能。

[编辑1。]
当我尝试使用TestModule.Interface1模式时，我得到相同的错误（以不同的方式说）。但是IntelliSense看到了Interface1：

[编辑2。]
我注意到我不能使用其他项目中的文件。即使我在第一个项目中添加了正确的引用（/// <reference ...）并链接了所有文件。

Answer 1

有很多方法可以做到这一点。

选项1 - 项目参考（TypeScript 3.0 +）

如果您使用的是TypeScript 3.0，请查看使用项目引用。阅读更多here。

选项2 - 构建脚本

使用gulp-typescript，grunt-ts或仅批处理脚本将文件复制到主项目的文件夹中。

或者，Visual Studio中的run a build event将文件复制到主项目。

选项3 - npm包

如果您使用npm，则可以为其他项目创建一个包。然后，您可以在主项目中使用您的包。 Specifying a local dependency是一种很好的方法，可以使用sinopia这样的私有存储库服务器。我从来没有使用它，但它看起来效果很好。

选项4 - NuGet包

您可以查看creating a nuget package然后installing it locally。

选项5 - --declaration --outDir编译器选项

您可以将--outDir编译器选项或tsconfig.json中的outDir属性设置为其他项目的目录，然后使用--declaration进行编译，以便生成声明文件（.d.ts）也是。例如：--declaration --outDir ../Test1/External。

原始答案（使用--out）

如果右键单击库项目并单击属性，则可以在Visual Studio中执行类似操作。在TypeScript Build标签中，选中Combine JavaScript output into file选项，然后在主项目中指定您想要的位置（例如$(SolutionDir)/TypedApp/External/TypedLibrary.js）。然后，还要检查Generate declaration files以生成.d.ts文件。

完成此操作后，构建您的库项目，然后在主项目中包含.js和.d.ts。在html中加入.js文件，并在打字稿文件中引用.d.ts。

每次重建库项目时，它都会自动使用更改来更新主项目。

Answer 2

@dhsto建议的解决方案有效，但我找到了使用链接文件夹的替代方案。我有written about it in detail in this article，以下是如何实施的：

可以通过创建一个文件夹来保存您的引用，我喜欢将其命名为“_referencesTS”，该文件夹将包含Test1文件的所有链接。这可以单独完成，但如果必须为每个新的TS文件完成，则会变得非常麻烦。然而，链接文件夹会链接其下的所有文件，这可以通过编辑csproj文件来完成。

要编辑文件，请右键单击Test2项目，然后单击“Unload Project”，然后右键单击该项目并单击“Edit Test2.csproj”。导航到包含<ItemGroup>标记的<TypeScriptCompile>，然后插入以下代码：

<TypeScriptCompile Include="..\Test1\**\*.ts">
   <Link>_referencesTS\%(RecursiveDir)%(FileName)</Link>
</TypeScriptCompile>

在Test1中替换TS文件位置的相对路径，这使用通配符（*）链接所有子文件夹中的所有.ts文件（由*.ts指定）（由{{指示） 1}}）..

这些文件夹中的TS文件现在将在Test2中显示为链接，允许自动打字稿参考。

注意：此方法的唯一缺点是，当在链接文件夹中将新文件添加到Test1时，用户必须卸载并加载项目，或者关闭并打开解决方案，以使其显示在Test2中。

Answer 3

对事态感到沮丧，我编写了一个NuGet包，主要解决了这个问题。使用NuGet包，您只需将一个项目的引用添加到另一个项目中，它将以不会意外编辑错误文件的方式复制文件，并提供智能感知和调试。

详细信息可以在Readme.md中找到，或者您可以安装NuGet包并运行（我建议至少阅读如何使用部分）。

https://github.com/Zoltu/BuildTools.TypeScript.FromReferences

Answer 4

我只想添加David Sherret的答案，可以将TypedApp项目的lib文件添加为链接文件，而不是依赖于后期构建事件。我在很多项目的大型解决方案中遇到了一些后期构建事件的问题，现在链接文件对我来说还不错。 （我无法在答案中添加评论，因为我只有35个声望点。）

Answer 5

如果您使用--out参数进行编译，则只需使用/// <reference从Module2.ts引用Module1.ts。要了解有关TypeScript中代码组织模式的更多信息，请参阅http://www.youtube.com/watch?v=KDrWLMUY0R0&hd=1

可用的Visual Studio语言服务（一切都是这样）与您编译和实际在运行时可用的内容不同。

Answer 6

如果您需要在多个项目之间共享代码，您始终可以在需要的每个项目上创建符号链接。 http://en.wikipedia.org/wiki/Symbolic_link

Answer 7

basarat的答案是最接近跨项目TypeScript引用的最可靠解决方案。但是，在将共享TypeScript代码与引用项目的TypeScript合并时（例如，如果需要定位不同的ECMAScript版本，则很重要），源映射文件不会解析为共享项目的目录，因此调试将不起作用（在事实上，在将断点添加到另一个项目中引用的文件后，Visual Studio经常崩溃。

任何类型的链接文件（Visual Studio链接和符号链接）都不能在任何系统（Visual Studio，Chrome，WebStorm等）中进行调试 - ASP.NET基本上不存在链接文件调试器，也没有任何其他调试器;它们仅存在于Visual Studio中。

请参阅此问题/答案，说明在Visual Studio，Chrome和Firefox中对固体代码维护和调试都有效，同时仍保留将共享代码与引用项目代码相结合的能力（例如，重要的） ，如果您需要定位不同的ECMAScript版本）：Visual Studio: How to debug TypeScript in a shared project using IIS Express and cross-project references (no linking or duplicating files)

Answer 8

在共享项目中设置断点时，接受的答案将禁止在Visual Studio中进行调试。 （充其量，调试器将停止在已编译的javascript中的一行，但不是原始的Typescript，当然也不在其原始项目位置。）

在共享项目的属性中，让我们说将Javascript输出组合到[单个]文件中，并将其设置为AllShared.js，这也是一个AllShared.d.ts文件，因为生成声明文件已选中，并且还会生成AllShared.js.map因为生成源地图已被选中。

引用项目不应以接受的解决方案的方式复制或链接这些文件。相反：

第1部分，在引用项目中，如果它不存在则创建/typings/tsd.d.ts，并在该文件的底部附加行///<reference path="../../SharedProject/AllShared.d.ts" />。一旦完成，（并且至少完成了一次SharedProject的成功编译），Intellisense和Typescript编译器应该看到Interface1等。（如果路径/文件没有＆＃，你可能会得到一条红色的波浪线，强调语句） 39; t存在，这很好。）

第2部分，在引用项目的index.html中，在该项目自己的脚本标记之前添加行<script src="http://localhost:29944/AllShared.js"></script>。 localhost部分来自共享项目的属性，Web选项卡，项目URL。 （两者都是“IIS Express”和“本地IIS”工作。）

现在，当您运行引用项目时，您应该看到Internet Explorer **请求各自＆＃34;网站＆＃34;中的相关文件。无论是在SharedProject还是引用项目中，都应该点击Visual Studio断点。

。尽管此解决方案在没有gulp / grunt / powershell的情况下工作，但Visual Studio的将Javascript输出合并到一个文件中并不会以任何特定顺序将文件粘合在一起，最终会破坏您的码。然后你需要添加Gulp / etc。引用项目为共享***中的每个文件插入<script src="http://localhost:29944...标记，因为手动更新index.html是一个不好的选择。 （将Gulp添加到共享项目，将.js和.d.ts文件连接到单个文件会遇到.js.map文件的问题，这些问题不能简单地连接。）

** IE和VS都是微软的产品，所以如果你想使用VS的断点和调试器而不是网络浏览器，IE的效果会更好。

*** Gulp并不喜欢注入网址，只注意文件路径。在index.html {@ 1}}中给出HTML评论，如下所示：

<!-- SharedStuff:js --><!-- endinject -->