その他

Visual Studio CodeでjQueryのコードを書いてみる。

MS、Win/Linux/Mac対応のコードエディター「Visual Studio Code」をプレビュー公開 – 窓の杜」にある通り、Microsoft製コードエディター「Visual Studio Code」のプレビュー版が公開されたので早速使ってみました。

Visual Studio Codeのインストール

  1. Visual Studio Code – Code Editing. Redefined.」からWindows用のインストーラー(VSCodeSetup.exe)をダウンロードします。
  2. VisualStudioCode_jQuery_01

  3. 1.でダウンロードしたインストーラーを実行すると、Visual Studio Codeが自動的にインストールされます。
  4. VisualStudioCode_jQuery_02

    VisualStudioCode_jQuery_03

    VisualStudioCode_jQuery_04

  5. 2015/05/14 時点では下図の言語に対応していて、適当なXMLファイルを開いてみましたが、ちゃんとシンタックスハイライトされました。
  6. VisualStudioCode_jQuery_05

    Language Support in Visual Studio Code より

    VisualStudioCode_jQuery_06

軽く触っただけですが、動作は軽快で「Ctrl + Space」といったお馴染みのショートカットキーも使えるので、VSに慣れている人にとっては親しみやすいエディタだと思います。

また、HTMLやJavaScript等はインテリセンス対応とのことで、同じようにjQueryのコード補完も効けば嬉しいのになー、と思っていたところ、下記の手順でjQueryでもインテリセンスが効くようになりました。

インテリセンスをjQueryでも使えるようにする。

  1. ソースファイルを入れる適当なフォルダ(ここでは sample フォルダ)を作成します。
  2. DefinitelyTyped」からjQuery用の型定義ファイル「jquery.d.ts」をダウンロードし、1.で作成したフォルダ内に保存(ここでは sample -> typings -> jquery -> jquery.d.ts)します。
  3. Visual Studio Codeを起動し、「Open Folder」から、1.で作成したフォルダを開きます。
  4. VisualStudioCode_jQuery_07

  5. フォルダ名の横にある「New File」ボタンをクリックして、新規ファイルを作成します。
  6. VisualStudioCode_jQuery_08

  7. referenceディレクティブ(/// <reference path=”…” />)を使って、2.で保存した「jquery.d.ts」ファイルを参照すると、jQueryのコードでもインテリセンスが効くようになります。
  8. VisualStudioCode_jQuery_09

サクサク動いてjQueryのコードも書きやすい。
プレビュー版なので、まだ若干動作が不安定なところがありますが、今後の期待大なエディタです。

参考Webサイト

・Intellisense with Visual Studio Code
http://www.johnpapa.net/intellisense-witha-visual-studio-code/

2015年4月の人気記事前のページ

Office 365 APIをVBAから呼び出す(1)次のページ

関連記事

  1. その他

    Windows Azure MSDN 特典をアクティブ化しました。

    MSDN サブスクリプションの特典でWindows Azureが使える…

  2. その他

    bitlyのAPIキーを取得する

    今回はURL短縮サービスとして有名なbitlyのAPIキーを取得する方…

  3. その他

    ブログリニューアルしました。

    といっても、WordPressのテンプレートを変えただけですが・・・。…

  4. Microsoft Designer

    Microsoft Designerの紹介

    「Microsoft Ignite 2022」で発表されたサービス「M…

  5. その他

    mougの過去ログ検索サイト「mougle」を開設しました。

    2014/07/24 追記:mougleのデータベース更新とドメイ…

  6. その他

    ブログ引っ越しました。

    今年の2月から無料のWordPress.comでブログを書いていたので…

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

Time limit is exhausted. Please reload CAPTCHA.

※本ページはプロモーションが含まれています。

Translate

最近の記事

アーカイブ

PAGE TOP