tsconfig.json 被 Visual Studio Code 忽略

Question

我的项目根目录中有一个tsconfig.json 文件：

{
  "compilerOptions": {
    "target": "ES5",
    "module": "commonjs",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "sourceMap": true,
    "noEmitHelpers": true,
    "baseUrl": ".",
    "paths": {
      "services/*": ["./src/app/shared/services/*"]
    }
  },
  "compileOnSave": false,
  "buildOnSave": false,
  "awesomeTypescriptLoaderOptions": {
    "forkChecker": true,
    "useWebpackText": true
  }
}

我正在尝试定义我的路径，因此我们不需要在项目中使用相对路径。

例如：

我正在尝试让import { ConfigService } from 'services/config'; 工作，而不必输入：

import { ConfigService } from '../../shared/services/config/';

但是当我尝试这个时，我总是在 webpack 中遇到错误。

看起来它只是试图查看/node_nodules 而忽略tsconfig.json？我说的对吗？

我真的不知道我做错了什么。在谷歌上搜索了几个多小时，我快疯了。

任何帮助将不胜感激。

Answer 1

注意：实际上，您是对的，Webpack 不知道 tsconfig 文件并尝试以自己的方式解析模块。为了将它与 tsconfig 一起使用，您需要一个 TsConfigPathsPlugin 插件。请参考github上的这个issue。

我认为您的路径属性设置不正确。你需要告诉打字稿这样的事情：

对于匹配模式“services/”的导入，将以下路径附加到 import (假设你的根目录是 src 之前的一个) "/src/app/shared/"

"paths": {
  "services/*": ["/src/app/shared/*"]
}

因此，当编译器进入您的“services/config”导入时，它将匹配该模式，然后创建此路径“root/src/app/shared/services/config”以尝试解决它。

有关更多详细信息，请参阅 typescript module resolution 文档。