带有引用的 TypeScript 项目

Question

我使用 project references 从 "front" 和 "back" 中引用 "shared" 项目。

tsc -v: Version 3.3.3

项目结构：

./{MY_PROJECT}.code-workspace   /* the only file in this level */
./back
./back/tsconfig.json
./shared/src/
./shared/
./shared/tsconfig.json
./shared/src/
./front
./front/tsconfig.json
./front/src

我正在尝试从共享项目中将模块导入 ./front/src/article-view-model.ts：

import Article from "@shared/src/article";            // alias path
import Article from "../../shared/src/article"; // full relative path
export default class ArticleViewModel {
}

VS Code GUI 中会立即显示以下错误：

对于别名路径：

Cannot find module '@shared/src/article'. ts(2307)

对于完整的相对路径：

Output file '../../shared/src/article' has not been built from source file 'c:/{SOMEWHERE_IN_MY_PC}/shared/src/article.ts'. ts(6305)

Intellisense (VS Code) 确实适用于别名和相对选项：

如果我尝试忽略错误并构建，它会失败：

C:\Program Files\nodejs\node_modules\npm\bin\node_modules\typescript\lib\tsc.js:1296 throw e; ^

Error: Debug Failure. False expression. at mergeSymbol (C:\Program Files\nodejs\node_modules\npm\bin\node_modules\typescript\lib\tsc.js:25861:26) at C:\Program Files\nodejs\node_modules\npm\bin\node_modules\typescript\lib\tsc.js:25960:47 at Map.forEach () at mergeSymbolTable (C:\Program Files\nodejs\node_modules\npm\bin\node_modules\typescript\lib\tsc.js:25958:20) at initializeTypeChecker (C:\Program Files\nodejs\node_modules\npm\bin\node_modules\typescript\lib\tsc.js:48653:21) at Object.createTypeChecker (C:\Program Files\nodejs\node_modules\npm\bin\node_modules\typescript\lib\tsc.js:25711:9) at getDiagnosticsProducingTypeChecker (C:\Program Files\nodejs\node_modules\npm\bin\node_modules\typescript\lib\tsc.js:71398:93) at Object.getGlobalDiagnostics (C:\Program Files\nodejs\node_modules\npm\bin\node_modules\typescript\lib\tsc.js:71755:72) at Object.getGlobalDiagnostics (C:\Program Files\nodejs\node_modules\npm\bin\node_modules\typescript\lib\tsc.js:73528:86) at buildSingleProject (C:\Program Files\nodejs\node_modules\npm\bin\node_modules\typescript\lib\tsc.js:75803:127)

./front/tsconfig.json 内容:

{
    "compilerOptions": {
        "allowSyntheticDefaultImports": true,
        "baseUrl": ".",
        "module": "amd",
        "noEmitOnError": true,
        "noImplicitAny": false,
        "out": "./lib/front-bundle.js",
        "paths": {"@shared/*" : ["../shared/*"]},
        "preserveConstEnums": true,
        "removeComments": true,
        "sourceMap": true,
        "target": "es2015",
        "watch": true
    },
    "include": [
        "./src/**/*.ts",
    ],
    "references": [
        {
            "path": "../shared"
        }
    ]
}

./shared/tsconfig.json内容：

{
    "compilerOptions": {
        "allowSyntheticDefaultImports": true,
        "composite": true,
        "declaration": true,
        "module": "amd",
        "noEmitOnError": true,
        "noImplicitAny": false,
        "out": "./lib/shared-bundle.js",
        "preserveConstEnums": true,
        "removeComments": true,
        "sourceMap": true,
        "target": "es2015",
        "watch": true
    },
    "include": [
        "./src/**/*.ts",
    ]
}

Answer 1

这完全没有直接回答您的问题，但我觉得提供替代方案可能仍然有用。

以 'more standard' 方式解决此问题的一种方法是将您的 3 个代码库全部作为一个 NPM 包。

这样您的导入将类似于 @vendor/shared/foo 而不是 ../../../../shared/src/article。

使用npm link很容易处理项目的交叉依赖。

从技术上讲，您甚至不需要修改源代码结构（尽管您可能想要）。 shared 依赖项只是通过 node_modules.

软链接

Answer 2

我能够重现你得到的错误 if 我在包含 front、[=12= 的目录中有一个错误 tsconfig.json ] 和 shared。在这种情况下运行ning tsc -b 将在当前目录中选择错误的 tsconfig.json 并且由于它没有配置正确的 paths 或其他任何东西，编译失败并显示你得到同样的错误。

否则，如果我使用你的文件并发出 tsc -b front 而不是 tsc -b，它编译没有错误。

VSCode 没有运行麻烦的原因是为了提供补全，TypeScript 编辑器（通常）使用 TypeScript 提供的工具 tsserver。当编辑器给出 tsserver 的文件路径时，tsserver 通过查看包含源文件的目录然后向上进入父目录等获取相关的 tsconfig.json , 直到找到 tsconfig.json 文件。因此，当 VSCode 在 front/src/foo.ts 上工作并要求 tsserver 提供完成时，tsserver 查找没有匹配文件的 front/src，然后 front , 并在那里找到 tsconfig.json。

Answer 3

如果您是从根文件夹编译，请尝试添加本地 tsconfig.json 文件并设置所有 references，即 references: { path: './shared' }。否则，tsc 将找不到相关的项目来构建。

此外，没有根 tsconfig.json 将不会允许 VSCode GUI 在寻找根 tsconfig.json 时正常工作（这是我上次检查的状态，在这里你可以找到 related issue).

错误似乎与丢失文件有关。如果您可以提供有关您所采取的构建步骤的更多详细信息，我可以尝试更好地检查它

Answer 4

我在上次 activity 之后几乎没有解决它，但我不能 100% 确定是否由于以下更改而发生了这种情况。无论如何，我还是在这里发布，因为还有新的观点和投票，所以它可能对其他人有价值：

那是变化：

在./shared/tsconfig.json内容中：而不是：

{
    "compilerOptions": {
        "allowSyntheticDefaultImports": true,
        "composite": true,
        "declaration": true,
        "module": "amd",
        "noEmitOnError": true,
        "noImplicitAny": false,
        "out": "./lib/shared-bundle.js", <-------------
        "preserveConstEnums": true,
        "removeComments": true,
        "sourceMap": true,
        "target": "es2015",
        "watch": true
    },
    "include": [
        "./src/**/*.ts",
    ]
}

使用：

{
    "compilerOptions": {
        "allowSyntheticDefaultImports": true,
        "composite": true,
        "declaration": true,
        "module": "amd",
        "noEmitOnError": true,
        "noImplicitAny": false,
        "outDir": "./lib/", <-------------
        "preserveConstEnums": true,
        "removeComments": true,
        "rootDir": "./src", <-------------
        "sourceMap": true,
        "target": "es2015",
        "watch": true
    },
    "include": [
        "./src/**/*.ts",
    ]
}

Answer 5

我来到这里是为了解决“尚未从源文件构建”错误。原来 tsc 监视进程没有正确退出，所以我有两个实例在争夺文件。以防其他人遇到同样的问题

Answer 6

在搜索“typescript references has not been built from source file”时发现了这个。我的错误是当我 should've been using the --build flag: tsc --build tsconfig.json 时我运行宁 tsc -p tsconfig.json。如果您运行使用 -p TypeScript 将不会构建引用的项目。仅当您运行和 --build.

带有引用的 TypeScript 项目

TypeScript project with references

project-structure

typescript