コンテンツにスキップ

@stylistic/

jsx-first-prop-new-line

JSXにおける最初のプロパティの適切な位置を強制します。

ルールの詳細

このルールは、すべてのJSX要素の最初のプロパティが正しく配置されているかどうかをチェックします。設定可能なオプションは以下のとおりです。

  • always: 最初のプロパティは常に新しい行に配置されるべきです。
  • never: 最初のプロパティは新しい行に配置されるべきではありません。例えば、常にコンポーネントの開始タグと同じ行にあるべきです。
  • multiline: JSXタグが複数行にわたる場合、最初のプロパティは常に新しい行に配置されるべきです。
  • multiprop: 複数のプロパティがある場合を除き、最初のプロパティは新しい行に配置されるべきではありません。
  • multiline-multiprop: JSXタグが複数行にわたっており、かつ複数のプロパティがある場合、最初のプロパティは常に新しい行に配置されるべきです。これがdefault値です。

"always"設定時の、このルールに違反するコードの不正な

jsx
<Hello personal={true} />

<Hello personal={true}
    foo="bar"
/>

"always"設定時の、このルールに準拠するコードの正しい

jsx
<Hello
    personal />

<Hello
    personal
/>

"never"設定時の、このルールに違反するコードの不正な

jsx
<Hello
    personal />

<Hello
    personal
/>

"never"設定時の、このルールに準拠するコードの正しい

jsx
<Hello personal={true} />

<Hello personal={true}
    foo="bar"
/>

"multiline"設定時の、このルールに違反するコードの不正な

jsx
<Hello personal
    prop />
jsx
<Hello foo={{
}} />

"multiline"設定時の、このルールに準拠するコードの正しい

jsx
<Hello personal={true} />

<Hello
    personal={true}
    foo="bar"
/>

"multiline-multiprop"設定時の、このルールに違反するコードの不正な

jsx
<Hello foo={{
    }}
    bar />

"multiline-multiprop"設定時の、このルールに準拠するコードの正しい

jsx
<Hello foo={{
}} />

<Hello
    foo={{
    }}
    bar
/>

ルールオプション

jsx
"@stylistic/jsx/jsx-first-prop-new-line": `"always" | "never" | "multiline" | "multiprop" | "multiline-multiprop"`

使用しない場合

JSXを使用しない場合は、このルールを無効にできます。

MITライセンスの下でリリースされています。