Búsqueda de sitios web

javascript - Cómo imponer el punto y coma en una interfaz de Typescript

Tanto , (coma) como ; (punto y coma) son sintaxis válidas al declarar una interfaz en TypeScript, por ejemplo, los siguientes son ambos válidos

export interface IUser {
  name: string;
  email: string;
  id: number;
}

export interface IUser {
  name: string,
  email: string,
  id: number
}

A continuación está mi preocupación ya que también es válida. La mezcla de , y ; también funciona

export interface IUser {
  name: string;
  email: string,
  id: number;
}

Ahora, para mantener la consistencia, me gustaría hacer cumplir el uso de ; en todas las ocasiones. Mi herramienta de linting todavía pasa incluso con la regla de punto y coma aplicada para typescript. ¿Alguna idea de cómo se puede implementar esto?

.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-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": {}
    }
  ]
}

tsconfig.json

/* To learn more about this file see: https://angular.io/config/tsconfig. */
{
  "compileOnSave": false,
  "compilerOptions": {
    "baseUrl": "./",
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "downlevelIteration": true,
    "experimentalDecorators": true,
    "moduleResolution": "node",
    "importHelpers": true,
    "target": "es2015",
    "module": "es2020",
    "lib": [
      "es2018",
      "dom"
    ]
  }
}

Respuesta #1

En el archivo .eslintrc, agregue la siguiente regla como se menciona,

 "@typescript-eslint/member-delimiter-style": [
            "warn",
            {
                "multiline": {
                    "delimiter": "semi",
                    "requireLast": true
                },
                "singleline": {
                    "delimiter": "semi",
                    "requireLast": false
                }
            }
        ]

Acepta tres valores (o dos para una sola línea):

  • coma: cada miembro debe estar delimitado con una coma (,)

  • semi: cada miembro debe estar delimitado con un punto y coma (;)

  • ninguno - cada miembro debe estar delimitado con nada.

NOTA: esta no es una opción para una sola línea porque no tener un delimitador entre los miembros en una sola línea es un error de sintaxis en TS. requireLast determina si el último miembro en la interfaz/tipo debería tener un delimitador:

  • verdadero - el último miembro debe tener un delimitador.
  • falso - el último miembro no debe tener un delimitador.

Enlace de referencia: haz clic aquí

Artículos relacionados