TypeScript 入門の記録(18)プロを目指す人のためのTypeScript入門(3)
今回もプロを目指す人のためのTypeScript入門(以降、テキストと呼びます)でTypeScriptの学習をします。地道にコツコツ入門していく、3回目です。
第1章 イントロダクションの続き
まだ環境の準備が終わっていないので、入門が始まったような、まだ始まっていないような段階です。環境ができたら、簡単なプログラムを作成して実行してみます。
tsconfig.json の準備
前回、package.json に必要な設定を追加したのですが、今度は、TypeScriptコンパイラオプションの設定をします。TypeScriptコンパイラオプションは、コマンドラインで指定する方法と、tsconfig.jsonに設定する方法があり、tsconfig.jsonの方が取り回しやすいので広く使われているそうです。ここは、広く使われている方法を学ぶのが良さそうなので、素直に tsconfig.jsonを作ります。まずは、デフォルトのtsconfig.jsonを生成します。
josn にコメントがあるので、とてもわかりやすいんですけど、これはTypeScript独自の機能で、通常はjsonにコメント入れられないんですよね。すべての json ファイルにコメントが入れられたらいいのに。コメント書けない代わりに、読めばわかるように書けってことなんでしょうけど。
このデフォルト定義を、テキストに従って書き換えます。
compilerOptions を修正したあと、最後に include オプションを追加しました。VSCodeだと、compilerOptions の表示を折りたたむことができるので、complierOptions の外に追加しやすいですね。この include オプションの設定追加で、src ディレクトリ配下のすべての .tsファイルがコンパイル対象にできます。ここまでの設定で、テキストの内容の学習が始められるようです。TypeScriptプログラミングの準備ができました。
Hello, world!
さぁ、お約束の"Hello, world!” の時間がやってまいりました!srcディレクトリにindex.ts を作成しました。
これを、npx tsc でコンパイルすると、dist/index.jsが生成されました。
これを実行してみます。
できた~!
TypeScriptで書いて、JavaScriptにコンパイルしてから、Node.jsで実行すれば良いのですね。
さて、今度は、index.tsの変数の型を変更して、コンパイルエラーを発生させてみます。
number型の messageに対して文字列が与えられているので、型が合っていないことがわかります。エラーを解消するために、index.tsのmessageをnumberに戻して保存します。
コンパイルして実行ができました。OKです。
さて、今日はここまで。第1章が終わったので、次回は「第2章 基本的な文法・基本的な型」に入ります。続きは、また来週~!
この記事が気に入ったらサポートをしてみませんか?