Visual Studio Code で Node.js アプリの単体テストを jasmine を使って作成していて、 どこでエラーになっているか分かりづらかったのでバグ取りするのにデバッグ実行できる方法を調べたのでここにまとめておきます。 目次 開発環境 の 準備 実装, テスト の 準備 デバッグ実行 開発環境 の 準備 Node.js で jasmine を使う場合、 jasmine というパッケージを global インストールして使いますが、 Visual Studio Code と組み合わせて使うときは jasmine-node を使った方が簡単に扱えます。 デバッグ実行できるようにするためには プロジェクトローカル へ jasmine-node のインストールを行います ...

Node.js で環境変数を 設定 / 取得 する方法については 別記事 があるのでそちらをご参照ください。 ここでは、VSCode に対して 環境変数を 設定 / 取得 する方法についてのみまとめました。 目次 環境変数設定を追加する 追加した環境変数を取得する 環境変数設定を追加する F5 実行したとき呼び出される launch.json に追記することで実現します。 以下に launch.json へ追記する手順を載せます。 ビューバーの「デバッグ」を選択 「歯車」アイコンを選択 launch.json に env プロパティを追加 今回は env プロパティ に "SAMPLE_MESSAGE": "H ...

Visual Studio Code (Windows版) でよく使いそうなキーボードショートカットをまとめました。 目次 一般 編集 移動 検索と置換 複数行選択 高度な編集 エディタ操作 ファイル操作 表示 デバッグ 統合ターミナル 一般 ショートカット 説明 Ctrl + Shift + P コマンドパレットの表示 Ctrl + P クイックオープン Ctrl + Shift + N 新規ウィンドウ Ctrl + Shift + W ウィンドウを閉じる 編集 ショートカット 説明 Ctrl + X ...

Visual Studio Code に ejs の シンタックスハイライト を追加します。 拡張機能は 「.ejs」 なので、これをインストールすれば自動的にシンタックスハイライトが有効化されます。 この記事では 「.ejs」 をインストールして適用するところまでを行います。 ちなみに 「.ejs」 は 以下のマーケットプレースに公開されています。 Visual Studio Marketplace - .ejs 目次 インストール 利用 インストール コマンドパレットからインストールもできますが、ここではできるだけ画面を使ってインストールしてみます。 「拡張機能」を選択 「.ejs」を検索 「.ejs」の「インストール」を選択 ...

Visual Studio Code でも 静的解析 を利用してできるだけチームがコード規約に沿って開発できるようにしたいと思います。 そのための手段の一つが ESLint による静的解析。 ここでは Visual Studio Code に ESLint を組み込み、自動で検証される環境を構築してみます。 目次 インストール ESLint の インストール VS Code ESLint extension の インストール 使い方 初期設定 検証 自動修正 サンプルルール サーバーサイド クライアントサイド インストール ESLint の インストール 何はと ...

Typings で よく使う 基本的なコマンド についてまとめてみました。 目次 基本操作 定義のインストール 定義のアンインストール 定義の検索 インストール済み定義の一覧表示 おまけ 利用可能なソース よく使うライブラリの型定義 基本操作 定義のインストール typings/ ディレクトリ配下に型定義情報を書き込みます。 typings install [<ソース>~]<パッケージ名> [--global] [--save] ソース 型定義が保存されているデータソースを指定します。 指定できるデータソースは後述の「利用可能なソース」を参照してください。 パッケージ名 インストールしたい型 ...

目次 Typings とは インストール 動作確認 Typings とは Typings は TypeScript の 型定義ファイル 管理ツールです。 Typings では typings.json を利用して型定義ファイルのソースを判断します。 Visual Studio Code において、インテリセンスが TypeScript の 型定義ファイル ( d.ts ファイル ) を利用しているので、 Visual Studio Code の インテリセンス に何を使うかは 間接的に Typings で制御することになります。 インストール ここでは npm を利用してインストールを行います。 npm がまだインストールされていない場合、 こちら を参考にしてインストールを行ってください。 npm inst ...

Visual Studio Code で Node.js アプリケーション開発 を行う際、やはり インテリセンス が使いたいものです。 …が、標準だと インテリセンス が入っていません。 この記事では Visual Studio Code に Node.js および Express の インテリセンス 機能を追加して インテリセンス を 有効化 させる方法をまとめます。 目次 Visual Studio Code の インテリセンス インストール 手順 インテリセンス の 動作確認 Visual Studio Code の インテリセンス Visual Studio Code では TypeScript 向けの型定義ファイル (例えば node.d.ts ) を使ってインテリセンスを実現しているようです。 なので、 d.ts ...

Visual Studio Code をインストールする手順をまとめます。 基本的にはダウンロードしてそのままインストールすれば動きます。 インストール時のオプションで気にする点などはメモしてありますので、参考にしてください。 目次 ダウンロード インストール 各部の名称 ダウンロード Visual Studio Code のサイトへアクセス Download Visual Studio Code 「Download for Windows」を選択してダウンロード インストール 「次へ」を選択 「同意する」を選択して、「次へ」を選択 インストール先を設定して、「次へ」を選択 基本 ...