TypeScript_1st

TypeCsriptとは

JavaScriptに型を付けたもの = 静的型付き言語（厳格なルール）
JacaScript = 動的型付き言語（緩いルール）

TypeScriptはJavaScriptへコンパイルする必要がある。

書き方

var list: String[] = [];
let suuzi: Number = 1;
const name: String = "プログラミング";
let array1 : Array = [1, 2, 3, 4];
// 上と同じで型宣言が違う書き方
let array1 : number[] = [1, 2, 3, 4];

TypeScriptを書くメリット

・コンパイル時に型エラーチェックできる。
　この変数はString型しか入らないなど
・型がついているから可読性UP
・プログラムの処理速度が早い

環境構築

1. プロジェクトディレクトリ内にpackage.jsonの作成
   npm init -y
   

2. nodeのバージョンを確認し、TypeScriptのインストール
   node -v
npm i -D typescript もしくは npm i --save-dev typescript
   インストールが完了すると
   ・package.jsonにtypescriptのバージョンが記載される
   ・node_modules/.binフォルダにtscファイルが作成される。
   npx tsc -vでtscのバージョンが確認できる
   ・TypeScriptのファイル名.tsは下記のコマンドでコンパイルする。
   npx tsc TypeScriptのファイル名.ts
   

3. Webpackとwebpack-cli（コマンドラインツール）
   webpack-dev-server（ローカルサーバーが立てられる）
   ts-loader（コンパイル時に読み込む）をインストールする
   npm i -D webpack webpack-cli webpack-dev-server ts-loader

4. webpack.config.jsを作成し環境を設定する。
   touch webpack.config.js
   webpack.config.jsを編集する編集（ソースを参照）
   

5. TypeScriptの設定を決める環境設定をする。
   npx tsc --init
   tsconfig.jsonファイルが作成されその中に設定を入力する。