50
47

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

TypeScriptでJQueryを扱う方法

Posted at

TypeScriptは静的型付け言語です。TypeScriptを扱ったプログラミングの中でJQueryの型やjqueryの関数を使用したくなると思います。しかし、標準のTypeScirptではJQuery型は対応しておりません。

#対応方法
型定義ファイルを使用してJQuery型を使えるようにします。

まず型定義ファイルをダウンロードします。

DefinitelyTypedからjqueryを型定義ファイルをダウンロード
https://github.com/borisyankov/DefinitelyTyped
様々なライブラリの型定義ファイルがありますがjqueryというフォルダーをダウンロードしてください。

ダウンロードしたフォルダーの中のjquery.d.tsというファイルを任意のディレクトリに移動してください。

今度はTypeScriptのコードの方で一番最初の行に型定義ファイルを宣言します。
(pathはjquery.d.tsが存在しているディレクトリ)

main.ts
/// <reference path="lib/jquery.d.ts" />

これだけで動きます。

main.ts
var jquery :JQuery = $("#id");

function hoge(jquery :JQuery){
}

このようにJQuery型や$が使用できます。

#注意
これはあくまでコンパイルを通るようしただけなので、実際にはhtmlにjqueryのライブラリを読み込む記述をしないと動きません。

50
47
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
50
47

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?