テクノロジー

高機能エディターのVisual Studio Codeがかなり快適!

Tags:
Written by Kishimoto

Sublime Textをずっと使ってきたのですが、他のエディターがないかなーと探してたところ、Visual Studio Codeが凄く良さげに感じたので入れてみました。

Visual Studio Codeってなに?

Visual Studio Codeの公式サイト
Visual Studio Codeの公式サイト

Visual Studio Code(以下、VSCode)は、Microsoftが開発している無償の高機能エディターです。

日本語ページ:Visual Studio Code – Visual Studio
公式サイト:Visual Studio Code – Code Editing. Redefined

SublimeTextやAtomやBracketsみたいにプラグインを入れていくことで、自分なりのエディターにしていくことができるエディターです。

その中でも、VSCodeは自分の中で欲しい機能が揃っていたっていうのと、SublimeTextのように高速で、大きいファイル容量も開けて、キーバインドがSublimeTextと同じようにできる点が乗り換えた理由です。
キーバインドについては、プラグインで各種エディターに合わせられるみたいなので、乗り換えは結構楽なんではないでしょうか?

VSCodeの標準機能

投稿時のバージョン:1.21.1

  • エクスプローラー
  • 検索・置換
  • Git + Diff
  • デバッグ
  • プラグイン
  • エディターの分割表示
  • タブ化
  • ミニマップ
  • Emmet
  • コンソール
  • ターミナル
  • ログ出力
  • ワークスペース
  • 設定のカスタマイズ
  • テーマ(標準で複数入ってます。追加も可能)

一通りはこんな機能でしょうか。

ターミナルが標準搭載っていうのが、結構嬉しい機能です。
Gulpを実行したりタスク実行するときアプリ間を行き来してたので、かなり重宝してます。
あとGitもエディターで完結できるので、別アプリに行き来することなくGUIでコミットからプル・プッシュ・フェッチできるので楽になりました。

便利なプラグイン

プラグインで機能拡張ができるのですが、他のエディターにはないものが結構あって面白いです。

HTMLなど

AutoClose Tag HTMLのタグを自動で閉じてくれるやつ
AutoRename Tag HTMLの開始タグを変更すると閉じタグまで変更してくれる

PHP

PHP IntelliSense 定義されている関数やオブジェクトなどを補完してくれる
PHP Debug ブレークポイントを設定することで指定のポイントまでデバッグしてくれる

ビューワー

Excel Viewer エクセルのファイルやCSVを見易くしてくれる。編集やソートもできるよ
SVG Viewer SVGファイルを閲覧しながら編集もできる
Image preview 画像ファイルのプレビュー機能を追加してくれるただし1MBまで

エディター

vscode-icons エクスプローラーのアイコンを変える(アイコンのテーマのようなもの)
Path Intellisense ファイルパスを記入するときに補完してくれる
Bracket Pair Colorizer 各種括弧をカラーリングして見易くしてくれる
Evillnspector 全角スペースを強調表示してくれる
Guides インデントの縦ラインにガイドを入れる
Prettify JSON JSON形式のデータを整形してくれる
Trailing Spaces 半角スペースを強調表示してくれる

WordPress

WordPress Toolbox 4.9.4までの関数やClassやconstractorを補完してくれます
ACF-Snippet AdvancedCustomFieldの自動補完

おまけ

Twitter Client 各種設定するとツイッターのビューワーになります。アプリやブラウザ要らずでツイッターが見れるよ!つぶやくことも可能です。


プラグインは他のエディターにもあるようなものばかりですが、プレビュー機能は他にも色々あるので是非VSCodeで確認してみてね。
htmlファイルなら編集画面とプレビュー画面で分割表示も可能で、ローカルサーバーとBrowserSyncなどのような自動更新機能もあるので入れておくと便利かもですね。

ちょっと標準機能なのかはわからなくなってしまったのですが、Gulpのgulpfile.jsがあるとタスク一覧も見れて実行も可能だったので、ターミナルいかなくてもビルドできたりとかします。

株式会社MIRAIでは、Webマーケティング・コンサルティングから
ホームページ制作・動画制作など、様々なご相談を承っております。

お仕事のご依頼・ご相談はこちら