Angular 16：无法覆盖 tsconfig.app.json 中的“baseUrl”

Question

我使用 Angular CLI 创建了一个新工作区，并向其中添加了 2 个项目，一个库和一个应用程序。使用

"my-app"

运行应用程序

"ng serve"

效果很好。

将

.ts

文件复制到新的“my-app”项目后，出现编译器错误，并且无法识别相对路径：

import { environment } from 'environments/environment';

只有当我将其更改为：

时才有效

import { environment } from 'projects/my-app/src/environments/environment';

我的项目结构：

+ node_modules
+ projects
| + my-app
| | + src
| | | + app
| | | | - app.module.ts (etc.)
| | | + environments
| | | | - environment.ts
| | - tsconfig.app.json
- tsconfig.json
- package.json

到目前为止，我尝试用许多值覆盖

"baseUrl"

的

tsconfig.app.json

，但没有一个起作用：

"projects/my-app/src"
"src",
"./src"

（使用 VS Code 我多次重新启动 TS 服务器：

Ctrl + P > "Typescript: restart TS Server

”没有效果；似乎 TS 编译器根本不读取

tsconfig.app.json

）

在工作区的

"baseUrl"

文件中设置

tsconfig.json

有效：

工作空间 tsconfig.json：

...
"baseUrl": "./projects/my-app/src",
...

但是由于我稍后要向工作区添加其他项目，所以我不希望以这种方式解决它。

我知道如何添加

tsconfig.json

>

"paths"

的快捷方式，但我必须更改数百个，也许数千个

.ts

文件

import

语句：

{
  "compilerOptions": {
    "baseUrl": "./",
    "paths": {
      "@app/*": ["........"],
      "@pages/*": ["...../pages/*"],
      "@components/*": ["...../components/*"],
      "@state/*": ["...../state/*"]
    }
  }
}

我如何告诉我的 Angular 项目的 TS 编译器我已经覆盖了

baseUrl

中的

tsconfig.app.json

？

Answer 1

也许你正在寻找这个（https://www.typescriptlang.org/docs/handbook/module-resolution.html#path-mapping和https://www.typescriptlang.org/tsconfig#paths ）：

{
    "compilerOptions": {
        "baseUrl": ".",
        "paths" : {
            "*" : ["*", "projects/app1", "projects/app2"]
        }
    }
}