如何在Visual Studio 代码中设置Angular 应用程序路径以导入不带前缀的组件？

Question

我想导入没有任何路径前缀的组件和服务，像这样：

import { CarService } from 'services/car.service';

来自 Angular 应用程序结构中的文件，如下所示：

carproject
   src
      app (from here)
          components (from here)
             base (from here)
          pages (from here)
          services (from here)

carproject 文件夹中目前 tscongif.json 包含此基础 URL:

"baseUrl": "./src",

和 tscongif.app.json 在 src 文件夹中：

"baseUrl": "app" 

应用程序实际上允许以我在此问题之上提供的格式进行导入。应用程序正常启动。

但是Visual Code好像看不懂。并显示错误：

Cannot find module 'services/car.service'.ts(xxx)

如何正确配置 baseUrls，以便我能够从上述位置导入没有路径前缀的组件和服务，以便 Visual Studio Code 也能找到这些导入？

Answer 1

你应该改变你的tsconfig.json。我假设您的服务代码在服务文件夹中，所以我将更改配置

"baseUrl": "./",
"paths": {
   "services/*": ["src/app/services/*"],
 },

然后你可以这样导入

import { CarService } from 'services/car.service';