如何检查 Typescript 编译问题？答案

【问题标题】：How to lint for Typescript compilation issues?如何检查 Typescript 编译问题？
【发布时间】：2018-12-27 22:53:52
【问题描述】：

采用以下 Typescript 箭头函数：

/**
 * Returns a probably unique component name.
 * 
 * @param baseName a suggested name to make unique.
 * @returns a probably unique name.
 */
export const getUniqueComponentName = (
  baseName
): string => {
  return baseName + Math.round(Math.random() * 10000000)
}

当在tsconfig.json 中配置 Typescript 时：

"noImplicitAny": true,

这会导致编译错误：

[ts] 参数“baseName”隐含的类型为“any”。

Visual Studio Code 也很聪明，可以在开发过程中通知您这个问题。

我的目标是创建一个预提交 git 挂钩，以防止此类错误最终出现在版本控制中。我尝试使用tslint、husky 和lint-staged 使用此npm script：

"lint": "tslint --project tsconfig.json --config tslint.json"

但是，这不会导致 tslint 显示编译错误。它会被默默地忽略。

然后我尝试在 tslint.json 中添加规则：

"typedef": [
      true,
      "arrow-parameter"
    ]

虽然这确实让 tslint 抱怨，但它也开始在 tsc 编译器不抱怨的匿名箭头函数中抱怨。在这些箭头函数中，不需要添加类型，因为类型之前已经在父范围中设置（它们是推断的）。

所以基本上，在这种情况下，我希望 tslint 的行为与 tsc 相同。任何时候出现会导致编译失败的错误（例如上面的箭头函数），我都想阻止提交，但没有实际编译为 Javascript。这可能吗？

【问题讨论】：

运行tsc --noEmit 会起作用吗？这本质上是在不生成 JS 的情况下运行静态分析器。
@y2bd 是的，我确认有效；这是推荐的方法吗？除了运行 tslint？
在我的工作流程中，我通常会进行正常构建，然后丢弃工件（以及单独的 lint 阶段）。如果您处于不理想的情况，这似乎完全没问题。
@y2bd 根据github.com/okonet/lint-staged/issues/412 不可能让lint-staged 仅在提交的文件上运行tsc。仅当您不传入 p 标志但随后所有配置选项都被忽略时，这才有可能。此外，您不能将 paths 配置作为命令行参数传递，所以不使用 p 似乎不是一种选择？
@y2bd 如果您能详细说明我之前的问题，我会提供 150 个代表的赏金

标签： typescript tslint pre-commit-hook husky lint-staged

【解决方案1】：

我认为您最好的选择是运行tsc --noEmit -p . 并过滤输出以查找修改文件中的错误。比如我把下面的脚本保存到tsc-some-files：

#!/bin/bash
declare -A include_files
for f in "$@"; do
  include_files["${f#$PWD/}"]=1
done
node_modules/.bin/tsc --noEmit -p . | (
  status=0
  show_continuation=false
  while IFS='' read -r line; do
    case "$line" in
    (' '*)
      if $show_continuation; then
        echo "$line" >&2
      fi
      ;;
    (*)
      file="${line%%(*}"
      if [ -n "${include_files["$file"]}" ]; then
        show_continuation=true
        echo "$line" >&2
        status=1
      else
        show_continuation=false
      fi
      ;;
    esac
  done
  exit $status
)

并将./tsc-some-files 设置为我的lint-staged 命令，它似乎有效。（如果需要，用 bash 以外的编程语言编写此代码，留给读者作为练习。）

请记住，虽然编辑一个文件可能会在另一个文件中引入错误（例如，如果您更改了另一个文件正在使用的某些内容的类型），所以我敦促您让您的项目清除 TypeScript 错误尽快通过任何必要的黑客攻击（只要您标记它们以便以后可以搜索它们），然后将您的钩子设置为在整个项目中没有错误。事实上，特别是关于noImplicitAny，几年前我将一个JavaScript项目迁移到TypeScript时，我写了一个脚本，在任何有隐式any错误的地方插入一个显式any，然后我修复了显式anys 闲暇时。如果你有兴趣，我可以分享脚本。

【讨论】：

这将在整个项目上运行 tsc，而不仅仅是在提交的文件上
您有什么顾虑？性能，或者您希望在下次修改这些文件之前忽略其他文件中的现有错误？
主要是第二种情况。第一个咯:)
更新了答案。
-A 在 Mac 上对我不起作用，所以我改为 -a 假设它是相同的。

【解决方案2】：

我没有足够的声誉将其添加为评论，但任何人都会收到类似于

的错误

./scripts/ts-staged-files.sh: line 4: 
   src/ui/Components/Select/Select.tsx: division by 0 
  (error token is "/Components/Select/Select.tsx")

我对 Matt McCutchen 的回答做了这个小修改来修复它。

#!/bin/bash

include_files=()

for f in "$@"; do
  include_files+=("${f#$PWD/}")
done

【讨论】：