Angular 1 项目的 TSLint 配置答案

【问题标题】：TSLint configuration for Angular 1 projectAngular 1 项目的 TSLint 配置
【发布时间】：2017-01-29 00:51:16
【问题描述】：

我的团队正在使用 Angular 1.5.* + typescript 进行项目。

谁能给我建议，让我为我这样的项目提供最佳 TSLint 配置？

我现在想从官方 TS repo 中添加 TSLint 配置 (https://github.com/Microsoft/TypeScript/blob/master/tslint.json) 并设置 ESlint 规则。 https://github.com/Microsoft/TypeScript/blob/master/tslint.json

够了吗？你怎么看？

提前感谢您的回答。

【问题讨论】：

标签： angularjs typescript eslint tslint

【解决方案1】：

我也有类似的情况。我使用tslint-microsoft-contrib 作为基线。

  "extends": "tslint-microsoft-contrib",

它肯定会在您期望的所有方面有所帮助。但是，AngularJs TypeScript 代码需要重新配置或关闭一些规则。我对函数名member-ordering、no-import-side-effect和no-unsafe-any进行了以下配置更改：

"function-name": [
  true,
  {
    // allow public methods to start with $ for $onChanges
    // and other Angular lifecycle hooks
    "method-regex": "^[a-z$][\\w\\d]+$", 

    // otherwise unchanged
    "private-method-regex": "^[a-z][\\w\\d]+$",
    "protected-method-regex": "^[a-z][\\w\\d]+$",
    "static-method-regex": "^[A-Z_\\d]+$",
    "function-regex": "^[a-z][\\w\\d]+$"
  }
],

// Variant ordering that places public statics before constructor
// So we can place AngularJs $inject just before the constructor
"member-ordering": [
  true,
  {
    "order": [
      "public-instance-field",
      "protected-instance-field",
      "private-instance-field",
      "public-static-field",
      "protected-static-field",
      "private-static-field",
      "constructor",
      "public-static-method",
      "protected-static-method",
      "private-static-method",
      "public-instance-method",
      "protected-instance-method",
      "private-instance-method"
    ]
  }
],

// angular.module(...).component(...) is a side-effect
"no-import-side-effect": false,

// ng.IController, among others in @types/angular, uses "any"
// and is flagged by this rule
"no-unsafe-any": false,

根据您定义 AngularJs 组件的方式，您可能不需要将 no-import-side-effect 设置为 false。我还没有看到任何关于在 TypeScript 中定义 AngularJs 组件的最佳方式的共识，这很遗憾，因为这被列为从 AngularJs 迁移到 Angular 2+ 的第 1 步。

遗憾的是，这错过了 AngularJs 自定义 tslint 规则以匹配最佳实践的可能性。我正在考虑在生成的代码上运行eslint-plugin-angular，或者将这些规则转换为 TypeScript。但更好的解决方案可能是迁移到 Angular 2+ 并使用 codelyzer.

【讨论】：

【解决方案2】：

够了吗？你怎么看？

我个人不会打开它，直到它成为一个问题。幸运的是，我有幸得到队友的尊重和爱戴，所以他们知道我的意思是好的。

你可以选择那个，也可以直接选择：

{
  "extends": "tslint:recommended"
}

使用 palantir 默认值：https://github.com/palantir/tslint/#configuration

【讨论】：