跳至主要內容

member-delimiter-style

已棄用

格式規則現在適用於 eslint-stylistic。 @stylistic/ts/member-delimiter-style 是此規則的替換。
請參閱 廢棄格式規則 以取得更多資訊。

需要一種特定介面與類型字面值成員分隔樣式。

🔧

此規則報告的一些問題可自動修正為 --fix ESLint 命令列選項.

在 TypeScript 中，介面和類型別名成員之間允許使用三種分隔符號

interface Foo {
    // Semicolons (default, preferred in TypeScript):
    name: string;

    // Commas (JSON-like):
    name: string,

    // Line breaks (none):
    name: string
}

為了程式碼可讀性，通常最好在你的程式碼庫中一致使用相同的樣式。

這項規則強制遵守一種可設定的程式碼樣式。它也可以標準化使用（或不使用）分隔符號在建構中的最後一個成員，以及單行宣告的獨立分隔符號語法。

.eslintrc.cjs
module.exports = {
  "rules": {
    "@typescript-eslint/member-delimiter-style": "error"
  }
};

在此處的遊戲空間嘗試這項規則 ↗

選項​

這項規則接受下列選項

type MultiLineOption = 'comma' | 'none' | 'semi';

type SingleLineOption = 'comma' | 'semi';

type DelimiterConfig = {
  multiline?: {
    delimiter?: MultiLineOption;
    requireLast?: boolean;
  };
  singleline?: {
    delimiter?: SingleLineOption;
    requireLast?: boolean;
  };
};

type Options = [
  {
    multiline?: {
      delimiter?: MultiLineOption;
      requireLast?: boolean;
    };
    multilineDetection?: 'brackets' | 'last-member';
    overrides?: {
      interface?: DelimiterConfig;
      typeLiteral?: DelimiterConfig;
    };
    singleline?: {
      delimiter?: SingleLineOption;
      requireLast?: boolean;
    };
  },
];

const defaultOptions: Options = [
  {
    multiline: { delimiter: 'semi', requireLast: true },
    singleline: { delimiter: 'semi', requireLast: false },
    multilineDetection: 'brackets',
  },
];

預設設定

{
  "multiline": {
    "delimiter": "semi",
    "requireLast": true
  },
  "singleline": {
    "delimiter": "semi",
    "requireLast": false
  },
  "multilineDetection": "brackets"
}

multiline 設定僅套用至多行 interface / type 定義。singleline 設定僅套用至單行 interface / type 定義。這兩個設定完全獨立，且不會彼此影響。

multilineDetection 決定如何計算多行

  • "brackets"（預設值）任何介面或類型中的新行都會使它成為多行。
  • "last-member" 如果介面的最後一個成員與最後一個括弧在同一行，則計算為單行。

delimiter​

接受三個值（或兩個值，適用於 singleline）

  • comma - 應使用逗號 (,) 分隔每個成員。
  • semi - 應使用分號 (;) 分隔每個成員。
  • none - 不應使用任何東西分隔每個成員。
提醒

none 不是 singleline 的選項，因為在單行中成員之間沒有分隔符號是 TS 中的語法錯誤。

requireLast​

決定 interface / type 中的最後一個成員是否應具有分隔符號

  • true - 最後一個成員一定要有分隔符號。
  • false - 最後一個成員一定不能要有分隔符號。

overrides​

可以讓你針對 interface 定義 / 內嵌 type 指定選項，或同時針對這兩者。

例如，要求為 type 使用逗號，並為多行 interface 使用分號

{
  "multiline": {
    "delimiter": "comma",
    "requireLast": true
  },
  "singleline": {
    "delimiter": "comma",
    "requireLast": true
  },
  "overrides": {
    "interface": {
      "multiline": {
        "delimiter": "semi",
        "requireLast": true
      }
    }
  }
}

範例​

此規則的範例程式碼與預設組態

// missing semicolon delimiter
interface Foo {
    name: string
    greet(): string
}

// using incorrect delimiter
interface Bar {
    name: string,
    greet(): string,
}

// missing last member delimiter
interface Baz {
    name: string;
    greet(): string
}

// incorrect delimiter
type FooBar = { name: string, greet(): string }

// last member should not have delimiter
type FooBar = { name: string; greet(): string; }
於遊樂場中開啟

何時不應使用此規則​

如果你出於風格考量特別想要使用兩種成員區隔符號，或不希望特別強制執行一種風格，則可以忽略此規則。

不過，請記住風格不一致可能會影響專案的可讀性。我們建議針對此規則選擇最適合你專案的選項。

資源​