JavaScript & TypeScript

新しい補完候補ポップアップUI

補完候補のポップアップが新しくなり、より洗練されました。

JavaScript と TypeScript における補完候補の表示はよりクリアにより一貫性が増しました。シンボルがどこで定義されているのか、スタンダード言語APIの一部かどうかが判別しやすくなります。複数の定義を持つシンボル用に新しいアイコンも用意されました。

New UI of completion popup

スマートで新しいインテンション(空気を読む機能)

Alt-Enterで表示される Propagate to destructuring declaration インテンションでは、分解宣言において過剰な変数を置換できるようになりました。分解宣言を完全に排除するには、Replace destructuring with property or index access と呼ばれるインテンションアクションを使ってください。

Smart new intentions

改善されたリネームリファクタリング

JavaScript や TypeScript ファイルにおいてシンボルをリネームする際、IDE は動的な利用箇所も一緒にグループ化するようになりました。デフォルトではそれらをリファクタリングから除外します。このことでリファクタリングはより正確になり、Refactoring Preview ウィンドウで何を正確にリネームする必要があるかをより詳細に制御できます。

Improved Rename refactoring

Vue.js

Vue.js コンポーネントライブラリのためのよりよいサポート

あなたの Vue.js アプリケーションでは Vuetify、BootstrapVue または Quasar を使っていますか?これらおよび他の Vue コンポーネントライブラリからのコンポーネントやそれらのプロパティのためのコード補完がより正確になりました。このことは IDE でこれらのライブラリを使って作業できるように適用した 新しいアプローチ によって実現しました。

Better support for Vue.js

コード編集

20以上の言語のシンタックスハイライトに対応

WebStorm で PHP や Python を調べる必要があることはありませんか?これらを含む多くの言語のシンタックスハイライトに対応しました。IDE に搭載された TextMate のグラマーファイルのおかげで追加の設定は不要です。

Syntax highlighting for 20+ languages

入力ミスしたキーワードと名前の補完

function の代わりに間違って fucnt や fnction とタイプしたことはありませんか?コード補完機能ではエラーの種類を理解し、最も関連しそうな選択肢を提案するようになりました。この機能はサポートされている全ての言語および全てのシンボル(キーワード, クラス, 関数, コンポーネント 等)で動作します。

Completion for mistyped keywords and names

シェルスクリプトサポート

WebStorm はシェルスクリプトでの作業をサポートします。コード補完機能は.sh と .bash ファイルで利用でき、新しい実行設定も利用可能になりました。IDE は lint のための ShellCheck やコードフォーマットのための shfmt とも連携しています。

Support for shell scripts

重複コードの検索

新しい Duplicate code fragment インスペクション(空気を読む機能)を使うと、プロジェクト内で重複したコードを検索することができます。リアルタイムにコードをチェックし、エディタにおいて潜在的な重複箇所をすぐにハイライト表示します。JavaScript、TypeScript、CSS、Sass、SCSS、Lessでこの機能を利用できます。

Searching for duplicate code

IDE

EditorConfig を使用したフォルダのコードスタイル

複数の.editorconfig ファイルを追加することで、プロジェクトのさまざまな部分において異なるコードスタイルを維持できるようになりました。長い間サポートされてきたスタンダードな EditorConfig オプションに加え、全ての IDE コードスタイルオプションをカバーするIDE 特有のプロパティを使うことができます。

Code style for a folder with EditorConfig

1つのウィンドウ内で複数プロジェクトをオープン

WebStorm 内でプロジェクトをオープンしており更に別のプロジェクトを開きたい場合、すでにオープンしているプロジェクトに追加(Attach)できるようになりました。このことで同じ IDE ウィンドウ内で複数のプロジェクトを参照できます。追加で開いたプロジェクトをクローズしたい場合は、プロジェクトビューのルートで右クリックし Remove from Project View メニューを選択してください。

Open multiple projects in one window

更新されたプラグインの設定

IDE のアップデートされた Plugin の設定画面で、必要なプラグインを見つけやすくなりました。プラグインの説明はプラグインの一覧の右側に表示されます。以前のバージョンで存在した Updates タブは削除され、Installed タブ内のプラグインの隣に新しく Update ボタンが追加されました。

ダウンロードされたプラグイン全てを無効化または再有効化するには、歯車アイコンをクリックして適切なオプションを選択してください。

Updated plugin configuration

バージョン管理

.gitignore ファイルでの補完機能に対応

.gitignore ファイルにおいて、IDEはファイル名やフォルダ名のコード補完を提案できるようになりました。.gitignore ファイル内の名前を選択し、Cmd または Ctrl を押下しながらクリックすることでプロジェクトビューのファイルやフォルダにジャンプできます。また、Version Control ウィンドウに表示された Unversioned files グループについて、Local Changes タブで右クリックし、Add to .gitignore メニューを選択することで、該当のファイルをすばやく.gitignore に追加できます。

Completion in .gitignore