JetBrainsユーザーグループの㊗️2018.1リリース勉強会に行ってきたよ
こんにちは、気温の上昇に合わせて、若干体重が増加気味のオッキーです。
今日は、JetBrains IDE製品(WebStorm、PhpStorm、IntelliJ IDEAなど)のバージョン2018.1リリースに合わせた勉強会に行ってきましたので、そのまとめ記事を書きました。告知不足(by 主催のサムライズム 山本さん)により出席者はなんと6名ということでしたが、逆に交流・情報交換が密な勉強会になりました!
翻訳記事
最初に、2018.1リリースの新機能を各製品別に翻訳した記事をご紹介。サムライズムのWebサイト(ページ右下の「最近の投稿」を参照)に掲載されています。一部、ショートカットを以下にまとめました。
続いて、当日紹介された2018.1リリースの新機能の中から、私が気になったものをハイライトでご紹介します。
Gitのパーシャルコミット
1ファイル内で複数箇所の変更をした場合、特定箇所のみをコミットすることができるようになりました。コマンドライン派っぽく言うとgit add -p
と同様の機能が、IDEのコミットウィンドウからできるようになった、ということです。
さらにIDEならではの機能として、特定箇所の変更を別のChangelistに入れておくことが可能になりました。例えば、ローカルで一時的に変更するけどコミットはしたくない、という時、ありますよね? そんなときにChangelistを別にしておけばコミット対象から外すことができます。以下の例ではHeadSection.vue
はコミット対象ですが、default.vue
はコミット対象から外れています。Default
というのがデフォルトのChangelistで、Never commit
が新たに作ったChangelistです。
これは今までのバージョンでも可能でしたが、2018.1リリースからは1つのファイル内の変更箇所ごとにChangelistを分けることができるようになりました。例えば、以下のように1ファイル内で2箇所に変更が発生しているとしましょう。
このとき、コード左横の色が変わってハイライトされている部分(ガターと呼びます)をクリックすると、変更履歴を確認できるツールバーが表示されます。さらに一番右横にあるDefault
をクリックすると、その変更箇所をどのChangelistに入れるかを選択できます。ここでは、Never commit
に入れてみます。
すると、HeadSection.vue
という1つのファイルが別々のChangelistに入っています!(何と言うことでしょう)
もうお分かりですよね。この状態でコミットをすると、先ほどNever commitに入れた変更箇所はコミットの対象から外れることになります。
この機能が役立ちそうなケースとしては、一時的にAPIのURLを書き換えたいけどコミットはしたくないなーという時です。URLを書き換えた行だけをコミット対象から外しておけば、同じファイルで別の箇所を変更してもコミットを忘れることがなくなりそうです。
接尾辞補完(Postfix Completion)
新たにRubyが追加されました。Rails派には朗報。
さらに、オリジナルの接尾辞補完を追加できるようになりました! ただし、現在はJava(JavaScriptではない)のみ。今後、他の言語もサポートされる予定のようです。
既存の接尾辞補完についても、名前を変えることができるようになりました。
コミットハッシュからのナビゲート
コミットログにコミットハッシュを入れておくと、Logパネルから該当のコミットにジャンプできるようになりました。RevertやCherry-Pickのときに便利そうです。
新しいVueプロジェクト
vue-cliからVueプロジェクトの作成ができるようになりました。IDEがサポートとか、すごい時代だ~!
Vueコンポーネントの抽出
Vue.jsの単一ファイルコンポーネント(*.vue)から、新たにコンポーネントを切り出す機能が追加されました! やり方は、切り出したい箇所を選んで、Alt + Enter(macは⌥⏎)からExtract Vue Component
を選択して、名前を入力&Enterするだけ。
これだけで、新規ファイル作成、該当箇所のtemplateの切り出し、関係するCSSの切り出し(ビデオの後半参照)、親コンポーネントでのimport
やcomponents
への追加を一気にやってくれます。マジ神。
その他
いつの間にかYouTrackが日本語化されていた(2017.4リリースからとのこと)。
まとめ
JetBrains最高! 今後もお布施アップデートしていきたいと思います!