JetBrains Rider 2026.1 Help

コードスタイル: JavaScript

このページを使用して、JavaScript ファイルのフォーマットオプションを設定します。 これらの設定を変更すると、 プレビュー ペインに、コードへの影響が表示されます。

タブとインデント

タブ文字を使用する

  • このチェックボックスをオンにすると、タブ文字が使用されます:

    • Tab キー押下時

    • インデント用

    • コードを再フォーマットするため

  • チェックボックスがオフの場合、JetBrains Rider はタブではなくスペースを使用します。

スマートタブ

インデントは 2 つの部分で構成されます。 1 つの部分はコードブロックのネストに起因し、他の部分はアライメントによって決定されます。

  • このチェックボックスが選択されている場合、ネストによって生じる部分にはタブとスペースの両方が(必要に応じて)含まれますが、位置合わせで定義される部分はスペースのみで構成されます。

  • このチェックボックスをオフにすると、タブのみが使用されます。 これは、指定されたタブサイズに合うスペースのグループを再フォーマットした後、自動的にタブに置き換えられることを意味します。

タブサイズ

このフィールドで、タブに収まるスペースの数を指定します。

インデント

このフィールドでは、各インデントレベルに挿入されるスペースの数を指定します。

連続インデントの文字数

このフィールドでは、式、メソッド宣言、メソッド呼び出しで、配列の要素間に挿入するスペースの数を指定します。

空行でインデントを保持する

このチェックボックスを選択すると、JetBrains Rider は空行にもコードがあるかのようにインデントを保持します。 チェックボックスをオフにすると、JetBrains Rider は空行のタブ文字とスペースを削除します。

チェーンメソッドをインデントする

関数の宣言では、チェーン内の 2 つ目以降のメソッドが別の行に表示されます。

  • チェックボックスをオンにすると、チェーンの 2 番目以降のメソッドが 1 番目の呼び出しに揃えられます。

  • チェックボックスをオフにすると、チェーンの 2 番目以降のメソッドは、呼び出されたオブジェクトと揃えられます。

グループ内のすべてのチェーン呼び出しをインデントする

このチェックボックスをオンにすると、最初の呼び出しメソッドとそれ以降の呼び出しメソッドがインデントされます。

このチェックボックスは、 チェーンメソッドをインデントする チェックボックスが選択されている場合にのみ使用できます。

すべての連鎖呼び出しのインデントがオフ
すべての連鎖呼び出しをインデントするがオン

Space

このタブを使用して、JetBrains Rider に自動的にスペースを挿入する場所を指定します。 関連する場所の説明の横にあるチェックボックスを選択し、 プレビュー ペインで結果を確認します。

折り返しと波括弧

このタブでは、JetBrains Rider が ソースコードの再フォーマット時にさまざまなコード構成体へ適用する例外、波括弧の配置、位置合わせオプションをカスタマイズします。 プレビュー ペインで結果を確認します。

次でハードラップ

このフィールドでは、要素の右側に必要なスペースの数を指定します。 デフォルト オプションを受け入れると、 グローバル設定の値が使用されます。

入力時に折り返す

このフィールドで、編集したテキストを指定の 次でハードラップ フィールドに収める方法を指定します。

  • デフォルト: グローバル設定から 入力時に折り返す 値を使用するには、このオプションを選択します。

  • はい: 右マージン フィールドの値を使用するには、このオプションを選択します。

  • いいえ: このオプションを選択すると、行は右マージンで指定された値を超える可能性があります。

ビジュアルガイド

このフィールドには、複数の右マージンを指定します。 デフォルト値のままにするか、余白のスペース数を入力することができます。 複数のマージンを指定する場合は、コンマで区切って番号を入力します。

整形時に保持

チェックボックスを使用して、JetBrains Rider がソースコードを再フォーマットするときに行う例外を設定します。 例: デフォルトでは、 改行 チェックボックスが選択されています。

コードに標準の規則よりも短い行が含まれている場合は、再フォーマットする前に 改行 チェックボックスを無効にすることで行を変換できます。

折り返しオプション

折り返しのスタイルは、左側のペインで指定されたさまざまなコード構成体に適用されます(たとえば、メソッド呼び出し引数や代入ステートメントなど)。

  • 折り返さない - このオプションが選択されている場合、特別なラッピングスタイルは適用されず、ネストされた位置合わせと波括弧の設定は無視されます。

  • 長い場合は折り返す - このオプションを選択すると、右マージンを超える行が適切なインデントで折り返されます。

  • 常に折り返す - このオプションを選択すると、リスト内のすべての要素が折り返され、1 行に 1 つの要素が正しくインデントされます。

  • 長い場合は切り捨てる - 適切なインデントで 1 行に 1 つの要素が存在するように、右マージンを超えたリスト内の要素を折り返すには、このオプションを選択します。

位置合わせオプション

  • 複数行の場合は揃える - このチェックボックスをオンにすると、次の各行の同じ列でコード構成が開始されます。 それ以外の場合は、コード構造の位置は現在のインデントレベルによって決定されます。

  • <文字列>を次の行に配置 に - 行が折り返されたときに、指定した文字を次の行に移動するには、このチェックボックスを選択します。

  • 新しい行に 'else' を配置 - このチェックボックスを使用して、対応する文または文字を次の行に移動します。

  • <文字> の後の改行 - 指定した文字の後のコードを改行するには、このチェックボックスを選択します。

  • 特殊な else if の扱い - このチェックボックスを選択すると、 else if ステートメントは同じ行に配置されます。

    それ以外の場合、 else if ステートメントは対応するインデントレベルの次の行に移動されます。

  • ケースブランチをインデント - このチェックボックスを選択すると、 case ステートメントは対応するインデントレベルに配置されます。 それ以外の場合、 case ステートメントは switch と同じインデントレベルに配置されます。

  • オブジェクト - リストからオブジェクトの整列方法を選択します:

    • 揃えない: 連続した行の属性は整列しません。

    • コロンの位置: 順次行の属性はコロンに揃えられます。

    • 値の位置: 連続した行の属性は値に対して整列されます。

  • 変数宣言 - 等号のアライメントを設定するには、次のオプションのいずれかを選択します。

    • 揃えない: 等号は揃っていません。

    • 複数行の場合は揃える: 複数行の var ステートメントの等号は、追加のスペースを挿入することによって位置合わせされます。

    • グループ化するときに整列する: 複数の var ステートメントの等号は、追加のスペースを挿入することによって位置合わせされます。

  • ES6 の import/export この 'from' 節を揃える: チェックボックスが選択されている場合、JetBrains Rider は importexport ステートメントを ECMAScript 6 コード内で自動的に整列し、コードが読みやすく保守しやすくなります。 プレビュー ペインで、コードフラグメントの配置と配置を比較します。

    ws_align_import_export_es6.png

    このオプションをオンにすると、JetBrains Rider は新しいコードをその場で整列します。 既存の import ステートメントおよび export ステートメントは、 Ctrl+Alt+L を押して コードを整形 すると整列されます。

波括弧配置オプション

波括弧配置スタイル

このリストを使用して、クラス宣言メソッド宣言関数宣言 、およびその他のタイプの宣言での左中括弧の位置を指定します。 利用可能なオプションは次のとおりです。

  • 行末に配置: このオプションを選択すると、宣言括弧を宣言行の末尾に配置します。

  • 折り返されている場合は次の行に配置: このオプションを選択すると、複数行の宣言行の後の行頭に開き括弧が配置されます。

  • 次の行に配置: このオプションを選択すると、宣言行の後の行の先頭に左中括弧が配置されます。

  • 次の行に Shift 配置: このオプションを選択すると、宣言の行が対応するインデントレベルに移動した後の行に左中括弧が配置されます。

  • 各次の行に Shift 配置: このオプションを選択すると、宣言の行が対応するインデントレベルに移動した後の行に開き括弧が配置され、次の行も次のインデントレベルに移動します。

波括弧を強制する

このリストから、 ifforwhiledo () while ステートメントの括弧の導入方法を選択します。 利用可能なオプションは次のとおりです。

  • 強制しない: このオプションを選択すると、中括弧の挿入が自動的に抑制されます。

  • 複数行の場合: ステートメントが複数の行にまたがっている場合に中括弧を自動的に挿入するには、このオプションを選択します。 JetBrains Rider は、条件だけではなくステートメント全体の行数を分析します。

    if (true) return false;

    JetBrains Rider は自動的に中括弧を挿入します:

    if (true) { return false; }
  • 常に :このチェックボックスを選択すると、JetBrains Rider は常に自動的に中括弧を挿入します。

空白行

このタブを使用して、再フォーマット後に JetBrains Rider が保持し、コードに挿入する空白行の場所と数を定義します。 結果は プレビュー ペインに表示されます。

空白行の指定

この領域では、再フォーマット後に保持する余白行数を指定します。

最小の空白行数

この領域では、 import ステートメントのブロックの後に、クラス、フィールド、メソッド、関数の周囲に余分な空行があるかどうかを構成します。 各オプションの横にあるフィールドで、残す余白の最小行数を指定します。

句読点

このタブのリストを使用して、終了セミコロン、一重引用符、double 引用符、末尾のコンマの自動挿入におけるディレクティブを作成します。

ステートメントの終了にセミコロン

  • 使用 にステートメントを終了するためにセミコロンを 新しいコードで

  • 使用 にステートメントを終了するためにセミコロンを 常時

  • 使用しない にステートメントを終了するためにセミコロンを 新しいコードで

  • 使用しない にステートメントを終了するためにセミコロンを 常時

引用符

  • ダブル新しいコードで 引用符を使用する

  • ダブル常時 引用符を使用する

  • シングル新しいコードで 引用符を使用する

  • シングル常時 引用符を使用する

末尾のコンマ

このリストを使用して、オブジェクト、配列、メソッド定義と呼び出しのパラメーターに 末尾のコンマを使用するかどうかを設定します。 利用可能なオプションは次のとおりです。

  • 保持

  • 削除

  • 複数行の場合に追加

コード生成

このタブで、生成されたコードのコードスタイルを設定します。

命名規則

このエリアでは:

  • 生成するフィールドやプロパティの名前に自動的に追加される既定の接頭辞を設定または受け入れます。

  • 生成されたファイルの名前のスタイルを選択してください。 例えば、JetBrains Rider がクラスを新しい自動生成ファイルに移動することを提案する場合、提案されるこのファイルの名前は、選択したスタイルに従いクラス名から生成されます。 クラスの名前を保持し、準拠するファイルを含むからさらに詳しく

コードのコメント

この領域で、生成するコメントのコードスタイルを設定します。

  • 最初の列に行コメントを入れる: このチェックボックスを選択すると、最初の列から行のコメントが始まります。 チェックボックスをオフにすると、コード内で行コメントが整列されます。

  • 行コメントの先頭に空白を追加する: このチェックボックスを選択すると、行コメント文字とコメント行の最初の文字の間にスペースが挿入されます。

    Add a space at line comment start off
    行コメントの先頭にスペースを追加するがオン
  • ブロックコメントの周りにスペースを追加する: ブロックコメントに先頭と末尾のスペースを追加するには、このチェックボックスを選択します。

    デフォルトでは、コードフラグメントをブロックコメントで囲むと、テキストはスペースなしで /* 文字を開いた直後に始まります。 */ 文字を閉じる前に、スペースも挿入されません。 このデフォルトのコードスタイルは、ESLint などの一部のリンターのルールと競合する可能性があります。

    Add spaces to block comments off
    Add spaces to block comments on

インポート

同じモジュールのメンバーのインポートをマージする

  • このチェックボックスが選択されている場合、同じモジュールからインポートされたシンボルは、区切り文字としてコンマを使用して 1 つの インポートステートメントにリストされます。 メンバーは、インポートされた順にリストされます。 アルファベット順に配置するには、 インポートされたメンバーを並べ替える チェックボックスを選択して コード | インポートの最適化 を実行します。

  • このチェックボックスをオフにすると、インポートされたシンボルごとに個別の インポート文が生成されます。

プロジェクト、リソース、またはソースルートを基準にしたパスを使用する

このオプションは、JavaScript コードでのインポートステートメントの自動生成時に適用されます。

  • このチェックボックスを選択すると、JetBrains Rider は、プロジェクト ルート、 リソースルート、または ソースルートからの相対パスを提案します。

  • デフォルトでは、このチェックボックスはオフになっており、JetBrains Rider は現在のファイルを基準にしたパスを提案します。

ディレクトリインポートを使用する (Node スタイルのモジュール解決)

次のような構造のプロジェクトがあるとします:

ディレクトリのインポート: プロジェクト構造
  • ディレクトリインポートを使用する チェックボックスを選択すると、ファイル src/lib/index.js ./src/lib としてインポートされます。

  • チェックボックスをオフにすると、ファイル src/lib/index.js ./src/lib/index.js としてインポートされます。

ファイル拡張子を使用する

このフィールドで、インポートステートメントのファイル拡張子を設定します。

  • 自動 - このオプションを使用すると、JetBrains Rider は常に次のファイル名に拡張機能を追加します:

    • .vue ファイル。

    • 拡張子が .mjs または .cjs のファイル。

    • package.json 内の "type":"module" を含むプロジェクトからのファイル。

  • 常に .js - このオプションを使用すると、JetBrains Rider はインポートステートメント内のファイル名に拡張機能を自動的に追加します。 これは、完全なファイル名を必要とするブラウザー (Chrome など) で ES6 モジュールを使用する場合に重要です。 JetBrains Rider は、コード補完でインポートステートメントを自動生成する場合や、 Alt+Enter でインポート生成を実行する場合の両方でこの設定を適用します。

  • しない - このオプションを使用すると、JetBrains Rider はインポートステートメントを生成する際、拡張子なしのファイル名を必ず挿入します。

パスエイリアスを使用する

このフィールドでは、 import または require ステートメントでパスのスタイルを構成します。

  • 常に - このオプションを使用すると、JetBrains Rider は常に webpack.config.js system.js 、または jsconfig.json の構成ファイルから エイリアスを使用します。

  • しない - このオプションを使用すると、JetBrains Rider は生成するインポートで常に相対パスを使用します。

  • 指定されたパス以外のファイルのみ - このオプションを使用すると、JetBrains Rider は同じエイリアスが定義されているファイル間のインポートを生成するときに相対パスを使用します。 他のすべてのファイルでは、パスマッピングが使用されます。

以下の例では、ファイル Animal.js および Bird.js は、 webpack.config.js でエイリアスが指定されている animated フォルダーのフォルダーに格納されています。 ファイル Dog.js はエイリアスの外にあります。

JavaScript: サンプルプロジェクト構造

エイリアス Lib は次のように構成されています。

resolve: { alias: { Lib: path.resolve(__dirname, './lib/objects/earth/animated/') } }

その結果、 常にしない の各オプションは、 Bird.js Dog.js の両方に同じ方法で適用されます。 指定されたパス以外のファイルのみ オプションを選択すると、JetBrains Rider は Bird.js に相対パス、 Dog.js にエイリアスを使用して、さまざまなスタイルの import ステートメントを生成します。

Import ステートメントは Lib エイリアスを使用します。

オプションは常に: エイリアスが使用されます

Import ステートメントは相対パスを使用します。

オプションなし: 相対パスが使用されます

JetBrains Rider は、 Bird.js の相対パスと Dog.js Lib エイリアスを使用して、さまざまなスタイルの import ステートメントを生成します。

import ステートメント: 使用されるエイリアスまたは相対パス

正確にインポートしない

このフィールドでは、JetBrains Rider がシンボルの自動インポート時にスキップする正確なパスを指定します。 代わりに、JetBrains Rider はシンボルをインポートするための代替パスを探します。

これは、モジュール全体ではなくサブモジュールをインポートできるモジュールで特に便利です。 例: より一般的な import {Observable} from 'rxjs'import {Observable} from 'rxjs/Observable' のようなインポートを優先させるには、 rxjs をリストに追加します。

スキップするモジュールのリストを管理するには:

  1. フィールドの右側にある をクリックします。

  2. 開いた モジュールの変更 ダイアログで、 アイコンを追加 をクリックし、 モジュールの追加 ダイアログでモジュール名を指定します。 リストからモジュールを削除するには、モジュールを選択して をクリックします。

インポートされたメンバーを並べ替える

  • このチェックボックスが選択されている場合、JetBrains Rider はマージした import ステートメント内のインポートしたメンバーをアルファベット順にリストします。 メンバーはインポートされた順序でカンマ区切りで一覧表示され、 コード | インポートの最適化 を実行したときだけ再ソートされますのでご注意ください。

  • このチェックボックスがオフの場合、マージされた import ステートメント内のメンバーは、常にインポートされた順序でカンマ区切りでリストされます。

モジュール別にインポートを並べ替える

  • このチェックボックスが選択されている場合、 コード | インポートの最適化 を実行すると、 import ステートメントはモジュール名でアルファベット順に再ソートされます。

  • このチェックボックスがオフの場合、 インポート文は常に生成された順序で表示され、この順序は コード | インポートの最適化 の実行後に変更されません。

配置

このタブで、環境設定に従って JavaScript コードを並べ替えるルールセットを定義します。

グループ化ルール

このエリアを使ってグループ化ルールを設定します。

  • プロパティフィールドに対応するgetter/setter をグループ化する

  • メソッドとアロー関数でフィールド初期化をグループ化する

  • オーバーライドされたメソッドをまとめる

    オーバーライドされたメソッドをクラスとインターフェースごとにグループ化するには、このチェックボックスを選択します。 順序 リストで、 順序を維持 または 名前で並べ替え オプションを選択します。

マッチングルール

この領域を使用して、ルールのリストとして要素の順序を定義します。すべてのルールには、修飾子や型などの一致のセットがあります。

  • 追加ボタン: このボタンを使用してルールを追加します。 空のルール 領域が開きます。

  • 削除ボタン: このボタンを使用してリストからルールを削除します。

  • 編集ボタン: このボタンを使用して既存のルールを編集します。 このボタンを表示するには、編集するルールに移動してボタンをクリックします。 表示されるポップアップで、ルールフィールドを変更します。

  • 上に移動ボタン​ 下に移動ボタン​: これらのボタンを使用して、選択したルールを上下に移動します。

空のルール

このエリアを使用して、新しい一致ルールを作成するか、既存のルールを編集します。 次のフィルターから選択できます。

  • タイプ: このフィルターを使用して、ルールのクラスまたはメソッドを選択します。

    型キーワードをクリックすると条件が否定されることに注意してください。

  • 修飾子: このフィルターを使用して、ルールの修飾子のタイプを選択します。

    修飾キーワードをクリックすると条件が否定されることに注意してください。

  • 名前⁠: このフィールドを使用して、ルール内のエントリ名を指定します。 このフィルターは、フィールド名、メソッド名、クラス名などのエントリ名のみに一致します。 フィルターは正規表現をサポートし、 標準的な構文(英語)を使用します。 一致は名前全体に対して実行されます。

  • 順序: このリストを使用して、ルールのソート順を選択します。 このオプションは、複数の要素が同じ一致ルールを使用する場合に役立ちます。 この場合、 順序を維持を選択すると、再配置前に設定されたのと同じ順序が維持され、 名前で並べ替えを選択すると、同じ一致ルールを持つ要素が名前で並べ替えられます。

  • エイリアス: このオプションは、 ルール エイリアス定義 ダイアログで定義されたエイリアスを表示します。 不要なものは削除できます。

アルファベット順に並べ替えボタン

このアイコンは、 順序 リストから 名前で並べ替えを選択すると表示されます。 アイコンは、このルールの項目がアルファベット順にソートされていることを示します。

選択して設定

該当する場合、リンクはページの右上隅に表示されます。 このリンクをクリックして、現在の言語コードスタイルのベースとして使用する言語を選択します。

コードスタイル設定の初期セットに戻り、変更を破棄するには、 リセット をクリックします。

2026 年 6 月 12 日