https://blog.mamansoft.net/2020/10/14/vscode-typescript-learning/
## プロジェクト作成
```shell
npm init -y
npm i -D typescript prettier
npx tsc --init --locale ja-jp --sourceMap --outDir out
```
`index.ts`を作成しておく。
```ts
function sum(x:number, y:number): number {
return x+y
}
const a = 10
const b = 15
console.log(`${a} + ${b} -> ${sum(a, b)}`)
```
## VS Code
開く。
```shell
code .
```
### ビルドの設定
`タスク: 既定のビルドタスクを構成する` > `tsc: build - tsconfig.json`
![[1b1f3eb2.png]]
![[5fa60b1d.png]]
### ビルドの実行
`タスク: ビルド: タスクの実行`
![[Pasted image 20210115211218.png]]
`out`ディレクトリ配下にjsファイルができる。
### 実行の設定
`デバッグ: launch.jsonを開く`で[[launch.json]]を作成する。
![[Pasted image 20210115211705.png]]
実行パスを変更する。
```diff
- "program": "${workspaceFolder}\\index.js",
+ "program": "${workspaceFolder}\\out\\index.js",
```
#### 実行前に必ずコンパイルする
[[launch.json]]の`configurations`配下に[[preLaunchTask]]を追加する。
実行時にデバッグコンソールをアクティブにするため[[internalConsoleOptions]]も設定する。
```json
"preLaunchTask": "tsc: ビルド - tsconfig.json",
"internalConsoleOptions": "openOnSessionStart",
```