メインコンテンツへスキップ

member-delimiter-style

非推奨

フォーマットルールは現在 eslint-stylistic にあります。 @stylistic/ts/member-delimiter-style がこのルールの代替です。
詳細については、フォーマットルールの非推奨を参照してください。

インターフェースと型リテラルに特定のメンバー区切りスタイルを要求します。

🔧

このルールによって報告されるいくつかの問題は、 --fix ESLint コマンドラインオプションで自動的に修正可能です。.

TypeScript では、インターフェースと型エイリアス内のメンバー間に 3 つの区切り文字を使用できます。

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

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

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

コードの可読性を高めるためには、一般的に、コードベース全体で同じスタイルを一貫して使用するのが最善です。

このルールは、設定可能な 1 つのコードスタイルを維持することを強制します。また、構成要素の最後のメンバーに区切り文字があるか（ないか）を標準化したり、単一行宣言用に別の区切り文字構文を使用したりすることもできます。

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

Playgroundでこのルールを試す ↗

オプション​

このルールは次のオプションを受け入れます。

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 定義にのみ適用されます。2 つの設定は完全に別であり、互いに影響しません。

multilineDetection は、何が複数行としてカウントされるかを決定します。

  • "brackets"（デフォルト）型またはインターフェース内の改行はすべて、複数行にします。
  • "last-member" インターフェースの最後のメンバーが最後の角かっこと同じ行にある場合、単一行としてカウントされます。

delimiter​

3つの値（または singleline の場合は2つ）を受け入れます。

  • comma - 各メンバーはコンマ (,) で区切る必要があります。
  • semi - 各メンバーはセミコロン (;) で区切る必要があります。
  • none - 各メンバーは何も区切り文字なしで区切る必要があります。
注意

none は、単一行のメンバー間に区切り文字がないと TS で構文エラーになるため、singleline のオプションではありません。

requireLast​

interface/type の最後のメンバーに区切り文字が必要かどうかを決定します。

  • true - 最後のメンバーには 必ず 区切り文字が必要です。
  • false - 最後のメンバーには 必ず 区切り文字があってはいけません。

overrides​

interface または type 定義/インライン 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; }
Playgroundで開く

いつ使用しないか​

スタイルの理由でメンバー区切り文字の両方の種類を特に使用したい場合、または一方のスタイルを他方のスタイルよりも強制したくない場合は、このルールを回避できます。

ただし、スタイルの一貫性がないと、プロジェクトの可読性を損なう可能性があることに注意してください。このルールには、プロジェクトに最適な単一のオプションを選択することをお勧めします。

リソース​