确保导入在 Typescript 中有效？

Question

在基于 Typescript 的项目的构建或 linting 阶段，有没有办法确保所有导入都是：

• 有效（路径不指向不存在的文件）
• 使用（没有未使用的进口）

询问，因为我们最近遇到了一个问题，即我们的项目似乎已经构建并通过了 linting，但由于 CI/CD 之后的相对导入路径无效而无法在我们的开发服务器上运行。

例如，通过构建步骤，但在运行时失败，因为实际路径应该是../utils/date ：

import { parseDate } from '../../utils/date';

此外，以下内容因未在 Visual Studio Code 中使用而变灰，但未作为 linting 或构建的一部分捕获：

import { displayInfo } from '../../utils/display';

Answer 1

要修复项目中的相对路径错误，我建议您使用 typescript 别名方式。 我的打字稿配置：

jsconfig.path.json

{
    "compilerOptions": {
        "baseUrl": "./",
        "paths": {
            "asssets/*": ["public/assets/*"],
            "components/*": ["src/components/*"],
            "hooks/*": ["src/hooks/*"],
            "helpers/*": ["src/helpers/*"],
            "screens/*": ["src/screens/*"],
            "services/*": ["src/services/*"],
            "state/*": ["src/state/*"],
            "theme/*": ["src/theme/*"]
        }
    },
    "include": ["src"],
    "exclude": ["node_modules", "build", "coverage"]
}

最后，您应该将此文件扩展到 tsconfig.json 配置文件。

配置文件

{
   ...
   "extends": "./jsconfig.path.json",
   ...
}

它将传递您使用的项目中的所有相对路径。