Visual Studio Code で Node.js アプリケーション開発 を行う際、やはり インテリセンス が使いたいものです。 …が、標準だと インテリセンス が入っていません。
この記事では Visual Studio Code に Node.js および Express の インテリセンス 機能を追加して インテリセンス を 有効化 させる方法をまとめます。
目次
Visual Studio Code の インテリセンス
Visual Studio Code では TypeScript 向けの型定義ファイル (例えば node.d.ts
) を使ってインテリセンスを実現しているようです。
なので、 d.ts
ファイル (DefinitelyTyped) を必要に応じてインストールすることで Node.js, Express に限らず さまざまな インテリセンスを実現できます。
この 型定義ファイルを管理するツールに 「Typings」 と呼ばれるツールがあり、 npm を利用してインストールすることができます。 「Typings」はいわゆる 「DefinitelyTyped の パッケージ管理ツール」 になります。
以下の手順では Typings をインストールして、 Node.js と Express の型定義ファイルを導入しています。
インストール 手順
まず前提として「すでに Node.js / npm がインストール済みである」ものとします。 まだ Node.js / npm を インストール していなければ こちら を参考にインストールしてください。
- typings を インストール
1
npm install typings --global
- プロジェクトディレクトリ へ 移動(以下は
C:\workspace\testproject
へ移動する例)1cd C:\workspace\testproject
- Node.js および Express の 定義ファイル を インストール
12
typings install dt~node --global --save
typings install dt~express dt~serve-static dt~express-serve-static-core --save
Typings がインストールする先は カレントディレクトリ になるので、プロジェクトルートディレクトリへ移動しておく必要があります。
--global
と指定しながらも カレントディレクトリ 配下 に typings フォルダ が作成され、その下にすべて保存されます。
なので、インテリセンス有効化したいプロジェクトのルートディレクトリへ移動してから上記操作をする必要があります。
インテリセンス の 動作確認
Visual Studio Code を再起動して適当な JavaScript ファイルを作成してみます。
以下の図のように 入力途中 または .
を入力した際プルダウンが出ていれば正常動作しています。
参考記事
最後に… このブログに興味を持っていただけた方は、 ぜひ 「Facebookページ に いいね!」または 「Twitter の フォロー」 お願いします!!