![](https://mekou.com/linux-magazine/wp-content/uploads/2018/07/f81fd2e4c52864042852c112ce927ae2-1.png)
Visual Studio Code(以下 VS Code) は、マイクロソフトが開発したソースコードエディタです。マイクロソフトが開発していますが、ソースコードは GitHub で公開されており、
Windowsはもちろん、Linux、Mac OS X 用のバイナリも提供されているので、マルチプラットフォームで開発するエンジニアには、どの環境でも同じ UI で操作が行え、ストレス無く開発が行えるソースコードエディタではないでしょうか。
VS Codeのダウンロードは以下から行います。
https://code.visualstudio.com/
今回は、Debian,Ubunt版の deb パッケージを選択してダウンロードして、Ubuntu ソフトウェアを起動してインストールを行います。
インストール後、Dashのホーム検索よりvscと入力してVS Codeを起動します。
VS Code の特徴として以下の点があげられます。
・マルチプラットフォーム
・軽量/高速
・デバッグ機能を内蔵
・シンタックスハイライト(分類ごとに異なる色やフォントで表示する)
・スニペット(断片入力)
・インテリセンス(変数名、関数名の自動補完システム)
・Gitサポート
・多くの機能拡張
まずソースコードが手元にない人もいると思うので、ローカル内に存在する kernelヘッダ /usr/src/linux-headers-バージョン番号/ をメニューの「ファイル」->「フォルダーを開く」よりフォルダーを開きます。Cのソースコードを選択すると、お勧めの拡張機能のインストールを促されるので「推奨事項を表示」をクリックすると対応する拡張機能が表示されます。
インストールしたい拡張機能の「インストール」ボタンをクリックして、「再度読み込む」をクリックすれば拡張機能が有効になります。
拡張機能は、Visual Studio Marketplace(https://marketplace.visualstudio.com/)で確認する事が出来ますが、
拡張機能メニューの[・・・]をクリックして「人気の拡張機能の表示」を選択して見ることもできます。
拡張機能は、マイクロソフト自身が作成したものもあれば、ユーザが作成したものも提供されています。VS Code は、その他沢山の機能を備えているがユーザが自分で定義できるスニペットの追加手順を紹介したいと思います。メニューの「ファイル」->「基本設定」->「ユーザースニペット」よりJavaScriptを選択します。既にサンプル設定がなされているので、コメントを外すだけで設定が有効になりますが、定義の意味は以下の通りです。
{ // Place your snippets for JavaScript here. Each snippet is defined under a snippet name and has a prefix, body and // description. The prefix is what is used to trigger the snippet and the body will be expanded and inserted. Possible variables are: // $1, $2 for tab stops, $0 for the final cursor position, and ${1:label}, ${2:another} for placeholders. Placeholders with the // same ids are connected. // Example: "Print to console": { "prefix": "log", "body": [ "console.log('$1');", "$2" ], "description": "Log output to console" } }
“Print to console” : スニペットの識別名。任意の名前を設定する。
“prefix” このキー値を入力すると、スニペット展開のトリガーとなります。
“body” 展開されるコードやテキストを設定する。
logと入力してTABキーを押すと、console.log(”); と自動で出力されてカーソルの位置が$1に移動し、もう一度 TABキーを押すと $2 にカーソルが移動します。