Angular項目返回類型的esLint規則

Question

我想要一個esLint規則來通知方法的返回類型。 但我無法做到這一點。 我試過這個"@angular-eslint/explicit-function-return-type": "on"但沒有效果。新的 Angular 項目有什么線索和好的規則嗎？

我想在這里有一個錯誤（規則），因此沒有返回類型；

signUp() 
{
}

我喜歡在警告或錯誤后調整它

signUp() : void
{
}

MRE：

請在此處查看： https://github.com/Sampath-Lokuge/esLint

這是一個Ionic/ Angular項目。 你可以看到這個文件： https://github.com/Sampath-Lokuge/esLint/blob/main/src/app/folder/folder.page.ts

我有這樣的默認文件：

"@angular/core": "~11.2.0",

.eslintrc.json

{
  "root": true,
  "ignorePatterns": [
    "projects/**/*"
  ],
  "overrides": [
    {
      "files": [
        "*.ts"
      ],
      "parserOptions": {
        "project": [
          "tsconfig.json",
          "e2e/tsconfig.json"
        ],
        "createDefaultProgram": true
      },
      "extends": [
        "plugin:@angular-eslint/ng-cli-compat",
        "plugin:@angular-eslint/ng-cli-compat--formatting-add-on",
        "plugin:@angular-eslint/template/process-inline-templates"
      ],
      "rules": {
        "@angular-eslint/component-class-suffix": [
          "error",
          {
            "suffixes": [
              "Page",
              "Component"
            ]
          }
        ],
        "@angular-eslint/component-selector": [
          "error",
          {
            "type": "element",
            "prefix": "app",
            "style": "kebab-case"
          }
        ],
        "@angular-eslint/directive-selector": [
          "error",
          {
            "type": "attribute",
            "prefix": "app",
            "style": "camelCase"
          }
        ]
      }
    },
    {
      "files": [
        "*.html"
      ],
      "extends": [
        "plugin:@angular-eslint/template/recommended"
      ],
      "rules": {}
    }
  ]
}

package.json

{
  "name": "A",
  "version": "0.0.1",
  "author": "A",
  "homepage": "A",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "^11.2.13",
    "@angular/common": "~11.2.0",
    "@angular/core": "~11.2.0",
    "@angular/forms": "~11.2.0",
    "@angular/platform-browser": "~11.2.0",
    "@angular/platform-browser-dynamic": "~11.2.0",
    "@angular/router": "~11.2.0",
    "@capacitor/core": "2.4.7",
    "@ionic/angular": "^5.5.2",
    "aws-amplify": "^3.3.27",
    "primeicons": "^4.1.0",
    "primeng": "^11.4.0",
    "rxjs": "~6.6.0",
    "tslib": "^2.0.0",
    "zone.js": "~0.10.2"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.1102.4",
    "@angular-eslint/builder": "2.0.2",
    "@angular-eslint/eslint-plugin": "2.0.2",
    "@angular-eslint/eslint-plugin-template": "2.0.2",
    "@angular-eslint/template-parser": "2.0.2",
    "@angular/cli": "~11.2.4",
    "@angular/compiler": "~11.2.0",
    "@angular/compiler-cli": "~11.2.0",
    "@angular/language-service": "~11.2.0",
    "@capacitor/cli": "2.4.7",
    "@ionic/angular-toolkit": "^3.1.1",
    "@types/node": "^12.11.1",
    "@typescript-eslint/eslint-plugin": "4.16.1",
    "@typescript-eslint/parser": "4.16.1",
    "eslint": "^7.6.0",
    "eslint-plugin-import": "2.22.1",
    "eslint-plugin-jsdoc": "30.7.6",
    "eslint-plugin-prefer-arrow": "1.2.2",
    "ts-node": "~8.3.0",
    "typescript": "~4.0.2"
  },
  "description": "A"
}

Answer 1

這是一個 typescript-eslint 規則，因此在您的 eslintrc 文件中，您需要將以下規則添加到規則部分：

"rules": {
  ...
  "@typescript-eslint/explicit-function-return-type": ["error"]
}

請注意，要打開此功能，您需要提供一系列選項，包括錯誤/警告的類型，而不是“打開”。

Answer 2

你也安裝了prettier嗎？ 這是我用於 IntelliJ 的內容，它適用於您要求的目的。 您也可以發布您的 package.json 嗎？

module.exports = {
  parser: '@typescript-eslint/parser',
  extends: ['plugin:@typescript-eslint/recommended', 'plugin:prettier/recommended'],
  parserOptions: {
    ecmaVersion: 2018,
    sourceType: 'module',
  },
  rules: {
    '@typescript-eslint/array-type': ['error', { default: 'array' }],
  },
};

編輯：查看您的 package.json 后，我建議安裝更漂亮的。