RubyMine 2024.1 ヘルプ

コードスタイル: JavaScript

このページを使用して、JavaScript ファイルのコードスタイルオプションを構成します。これらの設定を変更すると、プレビューペインにこれがコードにどのように影響するかが表示されます。

タブとインデント

タブ文字を使用する

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

    • Tab キー押下時

    • インデント用

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

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

スマートタブ

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

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

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

タブサイズ

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

インデント

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

連続インデントの文字数

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

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

このチェックボックスをオンにすると、RubyMine は空行にインデントを保持しているように見えます。チェックボックスをオフにすると、RubyMine は空白行のタブ文字とスペースを削除します。

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

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

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

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

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

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

スペース

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

折り返しと波括弧

このタブでは、ソースコードの再フォーマット時に RubyMine がさまざまなコード構造に適用する例外、ブレースの配置、配置オプションをカスタマイズします。プレビューペインで結果を確認します。

次でハードラップ

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

入力時に折り返す

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

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

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

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

ビジュアルガイド

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

整形時の保持

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

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

折り返しオプション

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

  • 折り返さない - このオプションを選択すると、特殊なラッピングスタイルは適用されません。ネストされたアライメントと波括弧の設定は無視されます。

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

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

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

アライメントオプション

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

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

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

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

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

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

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

  • オブジェクト - リストから、オブジェクトの配置方法を選択します。

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

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

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

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

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

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

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

  • ES6 の import/export 'from' 節を揃える : チェックボックスが選択されている場合、RubyMine は ECMAScript 6(英語) コード内の import および export ステートメントを自動的に整列させ、コードを読みやすく維持しやすくします。プレビューペインで、コードフラグメントの配置と配置を比較します。

    ws_align_import_export_es6.png

    このオプションをオンにすると、RubyMine は新しいコードをその場で整列させます。Ctrl+Alt+L を押してコードを再フォーマットした後、既存の import および export ステートメントが整列されます。

波括弧配置オプション

波括弧配置スタイル

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

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

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

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

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

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

波括弧を強制する

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

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

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

    if (true) return false;

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

    if (true) { return false; }

  • 常時 : このチェックボックスを選択すると、RubyMine は常に自動的に中括弧を挿入します。

空白行

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

空白行の指定

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

最小の空白行数

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

句読点

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

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

  • セミコロンを使用して新しいコードのステートメントを終了する

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

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

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

引用符

  • 新しいコードで二重引用符を 使用する

  • 常に二重引用符を使用する

  • 新しいコードで単一引用符を 使用する

  • 常に単一引用符を使用する

末尾のコンマ

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

  • 保持

  • 除去

  • 複数行の場合に追加

コード生成

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

命名規約

このエリアでは:

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

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

コードのコメント

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

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

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

    Add a space at line comment start off
    Add a space at line comment start on

  • ブロックコメントの周りにスペースを追加する : ブロックコメントに先頭と末尾のスペースを追加するには、このチェックボックスを選択します。

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

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

インポート

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

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

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

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

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

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

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

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

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

Directory import: project structure

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

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

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

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

  • 自動 - このオプションを使用すると、RubyMine は常に次のファイルの名前に拡張子を追加します。

    • .vue ファイル。

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

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

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

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

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

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

  • 常に - このオプションを使用して、RubyMine は常に使用するエイリアス(英語)をあなたの webpack.config.js、system.js、jsconfig.json 構成ファイルから。

  • 決して - このオプションを使用すると、RubyMine は生成されたインポートで常に相対パスを使用します。

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

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

JavaScript: sample project structure

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

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

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

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

Option Always: the alias is used

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

Option Never: relative paths are used

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

Import statement: alias or relative path used

正確にインポートしない

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

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

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

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

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

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

  • このチェックボックスが選択されている場合、RubyMine は、マージされたインポート文のインポートされたメンバーをアルファベット順にリストします。メンバーは、コード | インポートの最適化を実行した場合にのみ、インポートおよび再ソートされた順序でコンマ区切りでリストされていることに注意してください。

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

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

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

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

配置

このタブでは、好みに応じて JavaScript コードを並べ替える一連のルールを定義します。

グループ化ルール

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

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

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

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

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

一致ルール

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

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

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

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

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

空のルール

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

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

    タイプキーワードを 2 回クリックすると、条件が無効になることに注意してください。

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

    修飾キーワードを 2 回クリックすると、条件が無効になることに注意してください。

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

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

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

the Sort Alphabetically button

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

選択して設定

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

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

コードスタイル: HTML コードスタイル: JSON

関連ページ：

プラグインのインストール

プラグインは RubyMine のコア機能を拡張します。例: プラグインをインストールして、次の機能を取得します。バージョン管理システム、課題追跡システム、ビルド管理サーバー、その他のツールとの統合。さまざまな言語とフレームワークのコーディング支援サポート。ショートカットのヒント、ライブプレビュー、ファイルウォッチャーなど。新しいプログラミング言語を学ぶのに役立つコーディング演習。プラグイン設定を開くを押して IDE 設定を開き、を選択します。マーケットプレースタブを使用して、JetBrains...

コードスタイルを設定する

特定のコーディングガイドラインが企業内に存在する場合は、ソースコードを作成する際に、このガイドラインに従わなければなりません。RubyMine は、必要なコードスタイルを維持できます。IDE には、プロジェクトスキームとデフォルトスキームの 2 つの定義済みスキームが付属しています。プロジェクトスキームでは、構成する設定は現在のプロジェクトにのみ適用されます。これらの設定は、.idea の codeStyles フォルダーに保存され、VCS を介してプロジェクトと共有されます。プロジェクトのコードスタ...

コードの再フォーマットと再配置

RubyMine を使用すると、現在のコードスタイルスキームまたは .editorconfig ファイルで指定した要件に従ってコードを再フォーマットできます。で定義されていないものがあれば、プロジェクト設定から取得されます。コードの一部、ファイル全体、ファイルのグループ、ディレクトリ、モジュールを再フォーマットできます。コードの一部または一部のファイルを再フォーマットから除外することもできます。コードフラグメントを再フォーマットするエディターで、再フォーマットしたいコードフラグメントを選択します。再...

コードスタイル

スキーム：この領域では、コードスタイルスキームを選択し、必要に応じて変更します。コードスタイルスキームの設定は、RubyMine がコードを生成、リファクタリング、再フォーマットするたびに自動的に適用されます。IDE には、プロジェクトスキームとデフォルトスキームの 2 つの定義済みスキームが付属しています。プロジェクトスキームでは、構成する設定は現在のプロジェクトにのみ適用されます。これらの設定は、.idea の codeStyles フォルダーに保存され、VCS を介してプロジェクトと共有されま...

JavaScript のリファクタリング

リファクタリングとは、アプリケーションの動作を変更せずにソースコードを更新することを意味します。リファクタリングは、コードを安定した dry に保ち、保守を容易にできます。シンボルの移動リファクタリング：RubyMine を使用すると、ファイルやフォルダーを移動できるだけでなく、JavaScript トップレベルシンボルを移動できます。シンボルの移動リファクタリングは、ES6 モジュールのクラス、関数、変数に対して機能します。クラス、関数、変数を移動する移動するシンボルを選択します。を押すか、コン...

コードスタイル: HTML

このページを使用して、HTML ファイルのコードスタイルオプションを構成します。これらの設定を変更すると、プレビューペインにこれがコードにどのように影響するかが表示されます。タブとインデント：タブ文字を使用するこのチェックボックスをオンにすると、タブ文字が使用されます。キー押下時、インデント用、コードを再フォーマットするため、チェックボックスがオフの場合、RubyMine はタブではなくスペースを使用します。スマートタブインデントは 2 つの部分で構成されます。1 つの部分はコードブロックのネ...