【とらんすぱいら】

トランスパイラとは？

最終更新: 2026年10月2日

💡 ソースコードからソースコードへ変換する

ソースコードを、別の言語や言語バージョンのソースコードへ変換するツール。TypeScriptやJavaScriptの変換を例に、型チェック・ポリフィル・ソースマップとの違いを解説します。

📌 このページのポイント

矢印はソースコードの変換方向で、実行や型チェックの成功ではありません。出力する宣言方法などはツールと設定によります。対象環境での対応も確認します。

ひよこ

トランスパイラは、コンパイラと別物？

ペンギン先生

コンパイラの一種と考えられるよ。ソースコードを別のソースコードへ変換するものを指す。コンパイラは機械語だけを出力する、という区別ではないんだ。

ひよこ

どんな変換がある？

ペンギン先生

TypeScriptからJavaScriptへの変換や、新しいJavaScriptの構文を対象環境向けに書き換える例がある。BabelはJavaScript コンパイラとして案内されているよ。入力と出力が同じ言語の別バージョンでも、ソース同士の変換になる。

ひよこ

TypeScriptを変換できれば、型も確認済み？

ペンギン先生

別の役割だよ。tscは型チェックと出力を扱えるけれど、esbuildはTypeScriptの構文を変換しても型チェックはしない。変換ツールを使う場合は、別途型チェックがあるかを確かめよう。型注釈は出力から取り除かれるため、実行時の入力検査にもならない。

ひよこ

古い環境向けに変換すれば、何でも動く？

ペンギン先生

構文の書き換えだけでは、存在しない実行時APIまで使えるようになるとは限らない。必要なAPIはポリフィルなど別の仕組みで補う場合がある。対象のブラウザや実行環境、変換設定、依存ライブラリを合わせて確認するんだ。

ひよこ

変換後のコードから、元の場所を調べられる？

ペンギン先生

ソースマップを生成し、対応するデバッグ環境で使うと、変換後と元のソースの位置を結び付けられる。何を変換し、型チェックや結合を誰が行うかも整理しよう。ツール名だけで対応範囲や速度を決め付けないことが大切だ。

もっと詳しく知りたい人へ

バンドラと同じもの？

役割が違います。バンドラは、複数のモジュールや依存関係をまとめる処理を扱います。トランスパイルは構文などの変換です。esbuildのように、一つのツールが両方を扱う場合もあるため、実際の設定と処理を見ます。

そうとは限りません。型チェックをしないツールもあり、tscも設定によっては型エラーがあっても出力します。出力の有無だけで判断せず、チェック結果とnoEmitOnErrorなどの設定を確認します。

まとめ：ざっくりこれだけ覚えればOK！

「トランスパイラ」って出てきたら「ソースコードを、別の形のソースコードへ変換するツール」と思えばだいたいOK！

📖 おまけ：英語の意味

「Transpiler / Source-to-Source Compiler」＝ソースコードからソースコードへ変換するコンパイラ

💬 コンパイラの出力は、必ず機械語とは限りません。トランスパイラは、ソースコード同士の変換を説明する呼び方です。