如何配置 Angular 项目 tsconfig 路径 [] 而不会出现 linting 错误？

Question

我们的 tsconfig.ts

中有以下配置

{
  "compileOnSave": false,
  "compilerOptions": {
    "baseUrl": "src",
    "paths": {
      "@app/*": ["app/*"],
      "@pages/*": ["app/pages/*"]
      ...
    },

然后我们可以在其他 ts 文件中使用更简洁的导入，如下所示：

import {UrlConstants} from '@app/common/constants/url-constants';

linting 项目时出现问题：

Module '@app/common' is not listed as dependency in package.json

有什么方法可以解决这个问题而不用回到使用 ./***/***/ 进行导入？

Answer 1

您可以使用此处记录的白名单配置规则https://palantir.github.io/tslint/rules/no-implicit-dependencies

看起来像这样：

tslint.json

{
  "rules": {
    "no-implicit-dependencies": [
      true,
      [
        "app",
        "pages"
      ],
      "dev"
    ]
  }
}

“dev”选项并不真正适合您的场景，但如果您按照我喜欢的方式对测试进行 lint，它会很有用。

就个人而言，我认为该规则应该更聪明，并尝试在某种程度上解析路径的 tsconfig。有时一个人有很多路径，并不是每个人都使用 NPM。 JSPM 用户可能不得不禁用该规则，这是一种耻辱，因为如果您没有达到这个粗糙的边缘，该规则非常有动力并且非常有用。

这现在应该适用于 @ 前缀路径，因为 https://github.com/palantir/tslint/pull/4192 已合并。在升级之前，您可能需要使用 "app" 和 "pages"。