HTML5開発に適したIDEを探す（その9）「Visual Studio Code」

引き続きHTML5開発を目的としたIDEを紹介していきます。これまでに紹介してきたIDEは以下の通りです。

• Visual Studio
• WebStorm
• Google Chrome Workspaces
• NetBeans
• Aptana Studio
• Brackets
• Orion

今回は、IDEというよりは”エディタ”に分類されるものかもしれませんが、先日Microsoftがリリースしたマルチプラットフォーム向け開発者用エディタ、Visual Studio Codeを紹介します。

ASP.NET v5とnode.jsサポート

Visual Studio CodeはIDEであるVisual Studioとは異なり、軽量なプログラミングエディタと言った位置づけになります。コンパイルのような機能はなく、ASP.NET v5とnode.jsのみサポートしています。ただしHTML5やJavaScriptの入力補完をサポートしていますので、フロントエンド開発にも利用が可能です。

対象環境はWindows、Mac OSX、Linux

Visual Studio Codeは旧Atom Shell、現Electronを使って開発されているエディタです。同じElectronベースとしてはAtomが知られています。Atomと同じようにJavaScriptで作られたデスクトップアプリで、WindowsのみならずMac OSXやLinuxでも動作します。

HTML、スタイルシート、JavaScriptのハイライト対応

フォルダを開くプロジェクトブラウザ機能があります。HTMLファイルなどはハイライト、補完入力に対応していますので開発速度が増すでしょう。また、JavaScriptファイルはsrc属性に書かれたファイルへジャンプすることも可能です。

Gitでのバージョン管理対応

標準でGitによるバージョン管理をサポートしています。未コミットなファイルを一覧したり、Visual Studio Code上からコミットすることもできます。

ファイルの差分表示も可能です。

プロジェクト内のファイル検索

あらかじめ開いているプロジェクトフォルダ以下のファイル検索ができます。ファイルの中身も検索可能です。

入力補完

入力補完はHTML5/JavaScript/CSSに対応しています。JavaScriptの場合、外部ファイルの自動補完には対応していないようです。

コマンドパレット

コマンドはAtomと同じくコマンド+Shift+Pで呼び出します（Windowsの場合はCtrl + Shift + Pだと思われます）。ここからVisutal Studio Codeの操作がほぼすべて可能です。

エラー検出

コマンドパレットで!と入力するとJavaScriptのエラーが表示されます。変数が定義されていない場合のエラーなどになります。

Visual Studio Codeは軽量で、すぐに立ち上がって開発が可能です。IDEはどうしても重たくなってしまうので、Visual Studio Codeのように高速に動作してくれるプログラミングエディタはフロントエンド開発向きかも知れません。

機能は決して多くありませんが、使い勝手は良さそうです。まだプレビュー版とあって、今後の開発が楽しみなエディタです。

Visual Studio Code