Question

我想利用TypeScript 3.1中的项目引用功能。编译后，我项目的目录结构最初如下所示：

.
├── A
│   ├── a.ts
│   ├── dist
│   │   ├── A
│   │   │   └── a.js
│   │   └── Shared
│   │       └── shared.js
│   └── tsconfig.json
└── Shared
    ├── dist
    │   └── shared.js
    ├── shared.ts
    └── tsconfig.json

Shared目录的内容：

shared.ts：

export const name = "name";

tsconfig.json：

{
  "compilerOptions": {
    "target": "es5",                          
    "module": "commonjs",                     
    "outDir": "dist",                        
    "strict": true
  }
}

A目录的内容：

a.ts：

import { name } from "../Shared/shared"; 

console.log(name);

tsconfig.json：

{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "outDir": "dist",
    "strict": true
  }
}

我可以通过在A目录中运行node dist/A/a.js来成功运行它。

我对此不满意的是，所有内容都被复制到A的输出目录中。我以为项目参考可以解决此问题。

要启用项目引用，我将以下行添加到Shared/tsconfig.json。

"composite": true

以下是A/tsconfig.json：

"references": [
  { "path": "../Shared" }
]

现在，当我编译时，目录结构如下所示，这就是我期望的样子：

.
├── A
│   ├── a.ts
│   ├── dist
│   │   └── a.js
│   └── tsconfig.json
└── Shared
    ├── dist
    │   ├── shared.d.ts
    │   └── shared.js
    ├── shared.ts
    └── tsconfig.json

但是，当我在node dist/a.js目录中运行A时，出现以下错误：

module.js:538
    throw err;
    ^

Error: Cannot find module '../Shared/shared'

原因是在生成的a.js文件中，无法正确解析对导入模块的引用：

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var shared_1 = require("../Shared/shared");
console.log(shared_1.name);

有没有一种方法可以在不将所有输出文件都放入同一目录的情况下工作？

或者，有没有更好的方法来组织我的项目以利用项目引用？

Answer 1

的确，让相对导入路径对源文件和输出文件都起作用是很痛苦的。如果我理解正确，official recommendation将为整个复合项目设置一个主输出目录，并在其中包含Shared和A子目录，因此源文件和输出文件可以具有相同的相对布局。我不知道那是否就是您不想做的事。

我知道的唯一其他选择是让每个组件使用指向输出文件的非相对导入来导入其他组件（在您的情况下，您只需A导入Shared）。即A/a.ts将导入类似Shared/dist/shared的路径。由于您使用的是非相对导入，因此源文件或相应的输出文件中出现的相同导入路径将解析为相同的目标输出文件。在构建复合项目之前，导入将无法在IDE中解析：这是known limitation。从tsc doesn't rewrite imports开始，您将需要设置运行时环境和/或使用捆绑程序来处理非相对导入，并在必要时设置baseUrl和paths TypeScript编译器匹配选项。

如果需要，我很乐意为您提供两种方法的详细信息；请让我知道您在哪里卡住。

使用单独的`outDir`

1 个答案: