コードスタイル: JavaScript
このページを使用して、JavaScript ファイルのフォーマットオプションを設定します。これらの設定を変更すると、プレビューペインに、コードへの影響が表示されます。
タブとインデント
タブ文字を使用する |
|
スマートタブ | インデントは 2 つの部分で構成されます。1 つの部分はコードブロックのネストに起因し、他の部分はアライメントによって決定されます。
|
タブサイズ | このフィールドで、タブに収まるスペースの数を指定します。 |
インデント | このフィールドでは、各インデントレベルに挿入するスペースの数を指定します。 |
連続インデントの文字数 | このフィールドでは、式、メソッド宣言、メソッド呼び出しで、配列の要素間に挿入するスペースの数を指定します。 |
空行でインデントを保持する | このチェックボックスをオンにすると、PhpStorm は空の行にインデントを保持しているように見えます。チェックボックスをオフにすると、PhpStorm は空白行のタブ文字とスペースを削除します。 |
チェーンメソッドをインデントする | 関数の宣言では、チェーンの 2 番目以降のメソッドが別の行に表示されます。
|
グループ内のすべてのチェーン呼び出しをインデントする | このチェックボックスをオンにすると、最初に呼び出されたメソッドとそれ以降に呼び出されたメソッドがインデントされます。 このチェックボックスは、チェーンメソッドをインデントするチェックボックスが選択されている場合にのみ使用できます。 |
スペース
このタブを使用して、PhpStorm にスペースを自動的に挿入する場所を指定します。関連する場所の説明の横にあるチェックボックスを選択し、プレビューペインで結果を確認します。
折り返しと波括弧
このタブでは、ソースコードの再フォーマット時に PhpStorm がさまざまなコード構造に適用する例外、ブレースの配置、配置オプションをカスタマイズします。プレビューペインで結果を確認します。
次でハードラップ | このフィールドでは、要素の右側に必要なスペースの数を指定します。デフォルトオプションを受け入れると、グローバル設定の値が使用されます。 | ||||
入力時に折り返す | このフィールドで、編集したテキストを指定の次でハードラップフィールドに収める方法を指定します。
| ||||
ビジュアルガイド | このフィールドには、複数の右マージンを指定します。デフォルト値のままにするか、余白のスペース数を入力することができます。複数のマージンを指定する場合は、コンマで区切って番号を入力します。 | ||||
整形時の保持 | チェックボックスを使用して、PhpStorm がソースコードを再フォーマットするときに行う例外を設定します。例: デフォルトでは、改行チェックボックスが選択されています。 コードに標準の規則よりも短い行が含まれている場合は、再フォーマットする前に改行チェックボックスを無効にすることで行を変換できます。 | ||||
折り返しオプション | 折り返しスタイルは、左側のペインで指定されたさまざまなコード構成体に適用されます(たとえば、メソッド呼び出し引数、代入ステートメントなど)。
| ||||
アライメントオプション |
| ||||
波括弧配置オプション |
|
空白行
このタブを使用して、再フォーマット後に PhpStorm が保持してコードに挿入する空白行の場所と数を定義します。結果はプレビューペインに表示されます。
空白行の指定 | この領域では、再フォーマット後に保持する余白行数を指定します。 |
最小の空白行数 | この領域では、 |
句読点
このタブのリストを使用して、終了セミコロン、一重引用符と二重引用符、末尾のコンマの自動挿入でディレクティブを作成します。
ステートメントの終了にセミコロン |
|
引用符 |
|
末尾のコンマ | このリストを使用して、オブジェクト、配列、メソッド定義と呼び出しのパラメーターに末尾のコンマを使用するかどうかを構成します。使用可能なオプションは次のとおりです。
|
コード生成
このタブで、生成されたコードのコードスタイルを設定します。
命名規約 | このエリアでは:
|
コードのコメント | この領域では、生成されたコメントのコードスタイルを設定します。
|
インポート
同じモジュールのメンバーのインポートをマージする |
|
プロジェクト、リソース、またはソースルートを基準にしたパスを使用する | このオプションは、JavaScript コードでのインポート文の自動生成中に適用されます。
|
ディレクトリインポートを使用する (Node スタイルのモジュール解決) | 次のような構造のプロジェクトがあるとします。
|
ファイル拡張子を使用する | このフィールドでは、インポートステートメントのファイル拡張子を構成します。
|
パスエイリアスを使用する | このフィールドでは、
以下の例では、ファイル Animal.js および Bird.js は、webpack.config.js でエイリアスが指定されている animated フォルダーのフォルダーに格納されています。ファイル Dog.js はエイリアスの外にあります。 エイリアス
resolve: {
alias: {
Lib: path.resolve(__dirname, './lib/objects/earth/animated/')
}
}
その結果、常時となしの各オプションは、Bird.js と Dog.js の両方に同じ方法で適用されます。指定されたパス以外のファイルのみオプションを選択すると、PhpStorm は、Bird.js に相対パスを使用し、Dog.js にエイリアスを使用して、さまざまなスタイルの Import ステートメントは Import ステートメントは相対パスを使用します。 PhpStorm は、Bird.js の相対パスと Dog.js の |
正確にインポートしない | このフィールドでは、シンボルの自動インポート中に PhpStorm がスキップする必要がある正確なパスを指定します。代わりに、PhpStorm はシンボルをインポートするための代替パスを探します。 これは、モジュール全体ではなくサブモジュールをインポートできるモジュールで特に便利です。例: より一般的な スキップするモジュールのリストを管理するには:
|
インポートされたメンバーを並べ替える |
|
モジュール別にインポートを並べ替える |
|
配置
このタブでは、好みに応じて JavaScript コードを並べ替える一連のルールを定義します。
グループ化ルール | このエリアを使用して、グループ化ルールを設定します。
|
一致ルール | この領域を使用して、ルールのリストとして要素の順序を定義します。すべてのルールには、修飾子や型などの一致のセットがあります。
|
空のルール | このエリアを使用して、新しい一致ルールを作成するか、既存のルールを編集します。次のフィルターから選択できます。
|
| このアイコンは、順序リストから名前で並べ替えを選択すると表示されます。アイコンは、このルールの項目がアルファベット順にソートされていることを示します。 |
選択して設定
選択して設定 ...
このリンクをクリックし、現在の言語コードスタイルのベースを選択します。このリストには 2 つのオプションがあります。
言語 : 別の言語からコーディングスタイル設定を継承するには、このオプションを選択します。表示されるリストからソース言語を選択します。その際、現在の言語に適用可能な設定のみが使用されます。他のすべての設定は影響を受けません。
定義済みのコードスタイル : 特定のフレームワーク用に定義されたコーディング標準を使用するには、このオプションを選択してください。リストから次のフレームワークのいずれかを選択してください。
Symfony2(英語)。PhpStorm は、Twig(英語) の公式の Symfony2 コードスタイルをサポートし、Twig テンプレートの波括弧の開始ペアの後、波括弧の終了ペアの前に 1 つのスペースを自動的に挿入します:
{{ some_variable }}
このリンクは、該当する場合、言語固有のコードスタイルページの右上隅に表示されます。
リセットをクリックして変更を破棄し、コードスタイル設定の最初のセットに戻ります。
関連ページ:
プラグインのインストール
プラグインは PhpStorm のコア機能を拡張します。例: プラグインをインストールして、次の機能を取得します。バージョン管理システム、課題追跡システム、ビルド管理サーバー、その他のツールとの統合。さまざまな言語とフレームワークのコーディング支援サポート。ショートカットのヒント、ライブプレビュー、ファイルウォッチャーなど。新しいプログラミング言語を学ぶのに役立つコーディング演習。プラグイン設定を開くを押して設定を開き、を選択します。マーケットプレースタブを使用して、JetBrains マーケッ...
コードの整形
PhpStorm を使用すると、現在のコードスタイルスキームまたは .editorconfig ファイルで指定した要件に従ってコードを再フォーマットできます。で定義されていないものがあれば、プロジェクト設定から取得されます。コードの一部、ファイル全体、ファイルのグループ、ディレクトリを再フォーマットできます。コードの一部または一部のファイルを再フォーマットから除外することもできます。コードフラグメントを再フォーマットするエディターで、再フォーマットしたいコードフラグメントを選択します。再フォーマット...
コードスタイル
スキーム:この領域では、コードスタイルスキームを選択し、必要に応じて変更します。コードスタイルスキームの設定は、PhpStorm がコードを生成、リファクタリング、再フォーマットするたびに自動的に適用されます。IDE には、プロジェクトスキームとデフォルトスキームの 2 つの定義済みスキームが付属しています。プロジェクトスキームでは、構成する設定は現在のプロジェクトにのみ適用されます。これらの設定は、.idea の codeStyles フォルダーに保存され、VCS を介してプロジェクトと共有されま...
JavaScript のリファクタリング
リファクタリングとは、アプリケーションの動作を変更せずにソースコードを更新することを意味します。リファクタリングは、コードを安定した dry に保ち、保守を容易にできます。シンボルの移動リファクタリング:PhpStorm を使用すると、ファイルやフォルダーを移動できるだけでなく、JavaScript トップレベルシンボルを移動できます。シンボルの移動リファクタリングは、ES6 モジュールのクラス、関数、変数に対して機能します。クラス、関数、変数を移動する移動するシンボルを選択します。を押すか、コン...
コードスタイル: HTML
このページを使用して、HTML ファイルのフォーマットオプションを設定します。これらの設定を変更すると、プレビューペインに、コードへの影響が表示されます。タブとインデント:タブ文字を使用するこのチェックボックスをオンにすると、タブ文字が使用されます。キー押下時、インデント用、コードを再フォーマットするため、チェックボックスがオフの場合、PhpStorm はタブではなくスペースを使用します。スマートタブインデントは 2 つの部分で構成されます。1 つの部分はコードブロックのネストに起因し、他の部...