## 概要 以下のようなコードがあるとき。 ```ts /// hogehoge // hoge /** * 2つの値を足す * * @param x - 1つめの値 * @param y - 2つめの値 * @returns 足した値 */ function sum<T extends number>(x: T, y: T, z?: T): number { return z != null ? x + y + z : x + y; } const nullOr10Over = (v: number): { ok: true } | null => v > 10 ? { ok: true } : null; function main() { const v1 = 10; var v2: number = 20; let v3 = 30 as number; console.log(sum(v1, v2 + v3)); console.log(nullOr10Over(10)?.ok ?? undefined); } main(); // ここはtscでエラーになる unknownFunction(); /// end ``` [[JavaScript]]として動作する[[型注釈]]のないコードに変換したい。 ## やり方 [[Babel]]と[[plugin-transform-typescript (Babel)|plugin-transform-typescript]]を使う。 ```console npm i -D @babel/core @babel/plugin-transform-typescript ``` `transform.js`を作成する。[[#概要]]のコードは`main.ts`として作成しておく。 ```js const { transformFileSync } = require("@babel/core"); const r = transformFileSync("./main.ts", { plugins: ["@babel/plugin-transform-typescript"], }); console.log(r.code); ``` 変換する。 ```console node transform.js ``` 以下が出力される。 ```js /// hogehoge // hoge /** * 2つの値を足す * * @param x - 1つめの値 * @param y - 2つめの値 * @returns 足した値 */ function sum(x, y, z) { return z != null ? x + y + z : x + y; } const nullOr10Over = v => v > 10 ? { ok: true } : null; function main() { const v1 = 10; var v2 = 20; let v3 = 30; console.log(sum(v1, v2 + v3)); console.log(nullOr10Over(10)?.ok ?? undefined); } main(); // ここはtscでエラーになる unknownFunction(); /// end ``` ### ポイント - [[TypeScript]]の型としての正しさは保証しない - 基本的には[[型注釈]]を取り除くだけ - なので、[[tsc]]ではエラーとなるコードでもtransformしてくれる - transformできるケースの例 - 関数の引数型が違う - 代入する変数の型が違う - 存在しない関数の呼び出し - [[TypeScript]]の構文として間違っているやシンタックスエラーは拾える - もっと言うと[[型注釈]]を解析する妨げとなる要素はエラーになる - 変数や関数の構文ミス、予約語の誤り など - たとえば `const` を `constt` と書いたらエラーになる