angular - 如何逐步使现有的 Angular 应用程序 "fully strict"？

Question

我有一个现有的 Angular 应用程序，它在 Angular 4 时开始开发，现在它在 Angular 12 上。但是在开发时，strict mode 没有启用。现在，在应用程序稳定并部署到生产环境后，什么是逐步启用严格模式的最佳方式，即分阶段而不是打开每个严格选项。

我已经在这里阅读了答案Angular 10 Stricter Settings --strict ，一般用于启用严格模式。

我的问题与如何分阶段启用它有关。由于应用程序大小/复杂性处于中等水平，因此一次测试所有更改将是一项重大挑战。我在 angular strict config 中看到了一些选项，例如，其中一些可以手动配置，还有一些由 strict:true 开启:

1. noImplicitAny
2. strictInjectionParameters
3. strictTemplates
4. strictNullChecks
5. 在 tslint.json 中启用 "no-any": true

按特定顺序逐步启用这些设置的最佳方法是什么？哪个更好？这样它就可以分阶段进行测试和部署到生产中，而不是一整 block 都有错误/问题的变化被忽视。任何帮助都将不胜感激，尤其是那些已经以一点一点的方式而不是一整个推送的方式更新了现有项目的人。

Answer 1

一个好的方法:

1. 首先键入所有模型 - 接口(interface)/类型/类 - 因为这应该是类型的真实来源。在执行此操作时，避免(尽可能)使用 any类型。
2. 键入您的函数 - 虽然大多数时候，语言服务/编译器可能会推断出哪些类型进入和退出函数，但添加类型将确保您的编译器在您没有正确使用您的函数时告诉您
3. 充分利用泛型 - Angular 有许多接受泛型类型的函数，您可以利用这些函数来确保获得预期的类型。一个很好的例子是 HttpClient的功能:get , put , post , delete .比如说，你期待一个 number从 api 调用中键入，然后将它们添加到函数调用中:this.http.get<number>(someAPIUrl) .大多数图书馆都有很好的类型文档。
4. 您可以开始打开 ​​tsconfig标志，例如 noImplicitAny - 这将有助于缩小您需要添加更多您可能忽略的输入的地方。此时，你甚至可以打开strict模式也是如此。
5. 开启模板类型检查 - The Angular docs are super helpful for this - 我无法告诉您点击模板中对象的属性是多么容易，它会直接将我带到类/接口(interface)/类型定义。

当然，您可能需要一些时间才能到达您想要的位置，并且在您修复之前可能会遇到一些问题。所以在我的帮助下一点一点地完成它。

请注意，Angular 团队正在做更多工作来改进输入，例如 Typed Forms.