ESLint 和 snake_case inside TypeScript Type 属性

ESLint and snake_case inside TypeScript Type property

我需要对接口或类型中的属性使用 snake_case。我将规则 camelcase 设置为

'camelcase': ["error", {properties: "never"}],

照原样mentioned in docs。它不适用于接口和类型,但适用于 JS 对象。

export const test = {
    a_b: 1, // OK. No error
};

export interface ITest {
    a_b: number, // Identifier 'a_b' is not in camel case.eslint(camelcase)
}

export type TTest = {
    a_b: number, // Identifier 'a_b' is not in camel case.eslint(camelcase)
}

当我将规则设置为 'off' 时,错误消失了,因此此规则适用于 .ts 文件。

那么如何在 TS 中使用 snake_case 呢?谢谢。

我认为该规则不适用于类型,我建议通过在 ESLint 中实现以下块来为 TypeScript 文件禁用此规则。

{
    "rules": {
        "camelcase": ["error"],
    },
    "overrides": [
        {
          "files": ["**/*.ts", "**/*.tsx"],
          "rules": {
            "camelcase": ["off"]
          }
        }
    ],
}

一旦我们禁用了该规则,我们就可以引入 @typescript-eslint/eslint-plugin 来应用额外的 linting 规则,它将正确地检查接口和类型中的属性。

注意:如果您还没有安装插件和解析器,则必须安装,说明可在此处找到:https://www.npmjs.com/package/@typescript-eslint/eslint-plugin

参考 @typescript-eslint/naming-conventionhttps://github.com/typescript-eslint/typescript-eslint/blob/master/packages/eslint-plugin/docs/rules/naming-convention.md

{
    "plugins": ["@typescript-eslint"],
    "parser": "@typescript-eslint/parser",
    "rules": {
        "camelcase": ["error"],
        "@typescript-eslint/naming-convention": [
            "error",
            { "selector": "property", "format": ["snake_case"] }
        ]
    },
    "overrides": [
        {
          "files": ["**/*.ts", "**/*.tsx"],
          "rules": {
            "camelcase": ["off"]
          }
        }
    ],
}