TypeScriptは、コンパイルして、JavaScriptを生成する言語です。
詳しくはウィキや参考サイトをご参照ください。TypeScriptを編集するときの基本的な作業のメモ書きをまとめました。
以下Macのターミナルで実行することを前提としたコマンドの事例です。
まずはTypeScriptとtscのインストールが必要です。
TypeScriptのインストールする時
npm i -g typescriptグローバルのTypeScriptをアップデートする
npm update -g typescriptTypeScriptのバージョンを確認する（インストールしたら忘れた時）
npm -v typescriptTypeScriptをコンパイルするツール「tsc」をインストールする時
npm install -g tsctscのバージョンを確認するとき（インストールしたら忘れた時）
tsc -vそして、TypeScriptのファイルを作成します。
用意するTypeScriptのファイル index.ts
function greeter(person: string) {
return "がんばるぞ、" + person;
}
let user = "TypeScript初心者";
let hoge = document.getElementById('demo_id')
hoge.textContent = greeter(user);
このファイルを任意のディレクトリにおきます。
以下のコマンドを叩くと同ディレクトリにindex.jsが生成されます。
tsc index.ts 違うディレクトリにコンパイルしたい場合は以下です。
tsc index.ts --outDir [ディレクトリ名]さらに.tsファイルを保存した時に、連動してコンパイルすることも可能です。（便利）
tsc index.ts --outDir [ディレクトリ名] -w例えば「js」というディレクトリ配下にコンパイルしたとします。
tsc index.ts --outDir jsそしたらそのJSを読み込むHTMLファイルを作成しましょう。
<!DOCTYPE html>
<html>
<head>
<title>TypeScriptのコンパイル練習</title>
<meta charset="UTF-8" />
</head>
<body>
<div id="demo_id">test</div>
<script src="js/index.js"></script>
</body>
</html>これをindex.htmlとして、index.tsと同じディレクトリに置いて、ブラウザで参照してみます。
するとブラウザに「がんばるぞ、TypeScript初心者」という文字が表示されたら成功です。
