イマドキのIDE事情 第9回EclipseのJavaScriptエディタでjQueryを使用する
skill

イマドキのIDE事情 第9回
EclipseのJavaScriptエディタでjQueryを使用する

2014.08.07

ent49_img01.jpg

Eclipseのパッケージのうち、Eclipse IDE for JavaEE DevelopersなどWeb開発のためのパッケージには、標準でJSDTというJavaScriptの開発支援機能も付属している。
JSDTは、外部JavaScriptファイルをライブラリとして登録しておくことで指定してコード補完などを行うことが可能だが、jQueryなど複雑なライブラリについては登録してもうまく扱うことができない。JavaScriptは非常に柔軟な記述が可能なので致し方ないところだが、現在ほぼデファクトスタンダードと言っても差支えないjQueryを快適に利用できないというのも残念なところだ。
そこで今回はJSDTでjQueryを使用する際に便利なプラグインを紹介する。
竹添直樹

■jsdt-jqueryのインストール

jsdt-jqueryは、JSDTでjQueryのコード補完機能を提供するプラグインだ。以下の更新サイトからインストールすることができる。

http://svn.codespot.com/a/eclipselabs.org/jsdt-jquery/updatesite

また、Eclipseマーケットプレイスからもインストールできるので、こちらから導入してもいいだろう。

ent49_img02.jpg
Eclipseマーケットプレイスからのインストール

jsdt-jqueryのWebサイトには特に対応するEclipseのバージョンなどの記載はないが、本稿ではEclipse 4.4 Luna版のEclipse IDE for JavaEE Developerで動作確認を行った。

■jQueryのコード補完を試してみる

jsdt-jqueryをインストールすると、JSDTのライブラリ選択時にjQueryを選択可能になる。JavaScriptライブラリの設定はJavaScriptプロジェクトの作成時、もしくはプロジェクトの作成後にプロジェクトのプロパティーから行うことができる。

また、使用するjQueryのバージョンは1.0から2.1までの間で選択することが可能だ。

ent49_img03.jpg
ライブラリとしてjQueryを選択可能

ent49_img04.jpg
使用するjQueryのバージョンを選択

ライブラリにjQueryを追加すると、JavaScriptエディタでjQueryのコード補完が可能になる。もちろん外部JavaScriptファイルだけでなくHTMLファイル内の<script>要素内に記述された記述されたJavaScriptでも補完可能だ。補完候補が表示されるだけでなく、JsDocも表示されるのでコーディング時の参考になるだろう。

ent49_img05.jpg
jQueryのメソッドのコード補完

jQueryには$.map()などのユーティリティメソッドも用意されているが、残念ながらこれらについては補完できないようだ。

■まとめ

jsdt-jqueryはjQueryのコード補完機能を提供するというシンプルなプラグインではあるものの、実際のWeb開発ではjQueryの利用頻度は非常に高いと思われるので、入れておいて損のないプラグインといえるだろう。

なお、現在Eclipse FoundationではVJETと呼ばれるJavaScript向けの開発環境がインキュベーション中のようだ。元々はeBayが自社開発したツールをOSS化したものだ。VJETはjQuery以外にもDojoやNode .jsに対応するなど、JSDTと比べると外部ライブラリへの対応が充実しているのが特徴だ。

今後VJETが正式にリリースされた暁には、Eclipse FoundationからJSDTとVJETという2つのJavaScript開発環境が提供されることになる。両社がマージされてより強力なJavaScript開発環境を目指すのか、それともそれぞれに異なった方向に進化していくのかも気になるところだ。

原稿:竹添直樹
株式会社ビズリーチ所属。Scalaを愛するJVM系プログラマ。業務の傍らOSS開発や執筆活動を行っている。
https://twitter.com/takezoen

※本記事は2013年2月7日にマイナビニュースに掲載された記事を基に、一部加筆修正しています。

この記事はどうでしたか?

おすすめの記事

キャリアを考える

BACK TO TOP ∧

FOLLOW