左側に TypeScript を貼り付けて "変換" をクリック — こちらで XML に変換しますTypeScript コードを貼り付け

このツールでできること

TypeScript の interface をそのまま反映した XML ペイロードを手で書いたことがあれば — SOAP クライアント、RSS ジェネレータ、設定ファイル、コントラクトテストなど — どれだけ骨組みを組む必要があるかご存じでしょう。ブラウザが用意している XMLSerializer は既存の DOM 向けで、型付きオブジェクト向けではありません。ここに TypeScript を貼り付ければ、整形済みの XML が一発で返ります。単独の interface でも、type エイリアスでも、型付き const でも、深くネストしたものでも結果は同じです。

コンバータは値だけでなく型も読みます。interface Order { ... }const order: Order = { ... } を組み合わせると、interface の各フィールドを含む <Order> ルートが生成されます。リテラル側で欠けているオプショナルフィールド(field?: T)は、宣言されたシェイプに合わせて空要素になります。readonly は出力では無視されます。enum はその値を出力します(文字列 enum は文字列、数値 enum は数値)。ユニオン型は実際のリテラルが持つものを出力します。ジェネリクスは具体的な型パラメータで解決されます。

ネストした interface や配列はネストした要素として展開されます。items: OrderItem[] フィールドは、各子要素に要素型の名前を使って <items><OrderItem/><OrderItem/></items> になります。Record や Map 型は <Entry><Key/><Value/></Entry> のコンテナになります。Datebigintnull は型ごとに処理され、Date は ISO-8601、bigint は十進文字列、null は空要素になります。複数の型定義と一つの型付き定数を貼り付けた場合、シリアライズされるのはその定数で、interface はスキーマとして使われます。

使い方

3 ステップ。短い interface でも types.ts 全体でも同じように動きます。

1

TypeScript を貼り付け(またはサンプルを試す)

左のエディタにそのまま TS を放り込んでください。interfacetype エイリアス型付き constモジュール全体 — どれでも問題ありません。サンプルを読み込む をクリックすると、Order / OrderItem / Address のネストした現実的な例を見られます。

型注釈はそのまま残してください — 出力される要素名と型を決めるのに parser が使います。importexport 文も残して構いません。自動的に無視されます。

2

変換を押す

緑の 変換 ボタンをクリック。ツールは型を読み、値を解決して、XML を一発で出力します。処理中は短いローディング表示が出ます。

3

XML をコピー

右側のパネルには、標準に準拠した任意の XML パーサー が受け付ける、インデント済みの整形された XML が入ります。SOAP リクエスト、RSS テンプレート、設定ファイル、テストフィクスチャにそのまま貼り付けられます。

実際に役立つ場面

SOAP / XML API クライアント

SOAP リクエストボディ用の TypeScript interface があって、<code>fetch</code> で送るための XML のひな形が必要。interface と型付きの例を貼り付け、XML をコピーしてリクエストに貼り付けるだけです。

XSD ベースの契約

<a href="https://www.w3.org/TR/xmlschema-1/" target="_blank" rel="noopener">XSD</a> と並ぶドキュメント用に、TS の型から XML の例を生成します。型と同期した例を保ち、型はスキーマと同期している状態を維持できます。

設定ファイルのひな形

40 フィールドの Settings interface は、あらゆる XML ベースの設定ストア向けに編集可能な XML テンプレートになります。要素を手で組む必要も、タイプミスも、忘れフィールドもありません。

統合テスト用のモックデータ

Vitest や Jest のセットアップにある型付きフィクスチャを、今でも XML を消費するレガシーシステムやモックサーバー向けの XML シードデータに変換します。

よくある質問

型を使うのですか?それともオブジェクトの値だけですか?

両方です。型が要素名、順序、そしてどのフィールドが必須か(オプショナルが欠けていれば空要素になります)を決めます。実際の値リテラルがデータを提供します。interface 無しで const だけ貼り付けた場合、ツールはリテラルを直接使います — 動作はしますが、型ドリブンの安全性は得られません。

オプショナルフィールドやユニオン型はどう扱いますか?

値に存在しないオプショナルフィールド(field?: T)は、出力のシェイプを一貫させるため空要素(<field/>)として書き出されます。ユニオン型(string | number)はリテラルが実際に持つ値を出力します。タグ付きユニオン も動きます — 判別子は名前に応じて属性か子要素になります。

Date、bigint、enum はどうなりますか?

DateISO-8601 文字列になります。bigint は十進文字列として出力されます(n サフィックスは付きません)。文字列 enum は文字列値、数値 enum は数値を出力します。null は空要素になり、undefined はフィールドが必須宣言でない限り要素ごと削除されます。

ジェネリクス、Record、Map は扱えますか?

はい。ジェネリック interface は具体的な型パラメータで解決されます — 実際の Order 値を持つ Response<Order> は具体的なシェイプを出力します。Record<K, V> は、キーごとに名前付き要素を持つコンテナになります。Map<Entry><Key/><Value/></Entry> ペアのコンテナになります。タプル型は各スロットに対して 1 つの要素を出力します。

types.ts ファイルを丸ごと貼り付けても大丈夫ですか?

はい。TypeScript を好きなだけ貼り付けられます。import 文は無視され、型のみの宣言はシェイプを定義し、最初に export された、もしくはトップレベルの型付き const がシリアライズされます。候補が複数ある場合は、解決できるフィールド数が最も多いものが選ばれます。

貼り付けたコードは保存されますか?

コードは変換のためにバックエンドに送られますが、保存はしません — ペイロードのログも取りません。オンラインツール全般のお作法として、本当に機微な内容なら、貼り付ける前にざっと見直すことをおすすめします。

一緒に使えるツール

TypeScript から XML はパズルのひとつのピースです。相性の良いツールはこちら: