YAMLをTypeScriptに変換
YAMLデータからTypeScriptインターフェースを生成
YAML入力
TypeScript出力
YAMLをTypeScriptにとは?
TypeScriptは構造にインターフェースと型を使用します。このツールはYAMLからTypeScriptインターフェースを生成し、パースされた設定やデータに型を付けられます。YAML 1.2仕様が入力形式を定義しています。
変換はブラウザ内で行われます。サーバーには何も送信されません。生成された型はjs-yamlやyamlパッケージなどのパーサーで動作します。JSONをTypeScriptにするにはJSONをTypeScriptにを使用してください。
YAMLをTypeScriptの例
YAMLからTypeScriptインターフェースを生成します。テレコムテーマの例:
例:加入者レコード
TypeScript出力:
上のサンプルボタンをクリックして、エディターにより多くの例を読み込んでください。
このツールの使い方
YAMLを貼り付けまたはアップロード
YAMLをコピーして左のエディターに貼り付けます。<strong>アップロード</strong>をクリックして<code>.yaml</code>または<code>.yml</code>ファイルを読み込むこともできます。<strong>サンプル</strong>ボタンでサンプルデータを読み込みます。無効なYAMLはエラーを表示します。
コピーまたはダウンロード
<strong>コピー</strong>または<strong>ダウンロード</strong>を使用してください。JSONをTypeScriptにするにはJSONをTypeScriptにを、YAMLのフォーマットにはYAMLフォーマッターを使用してください。
YAMLをTypeScriptが役立つ場面
YAML設定を読み込むNode.jsやフロントエンドアプリ(例:<code>config.yml</code>、Kubernetesマニフェスト、CIワークフロー)を開発するとき、パースされたデータ用の型付き構造が必要です。ここにサンプルを貼り付けると、js-yamlやyamlパッケージで使用できるTypeScriptインターフェースが得られます。複雑なネストされたYAMLの型を手動で書くのは面倒です;このツールはサンプルから構造を推論します。
application.ymlやGitHub Actionsワークフローなどの設定ファイルは深いネストを持つことが多いです。生成された型はタイポの検出やIDEでのオートコンプリートに役立ちます。大きなYAMLから特定の値を抽出するには、まずJSONに変換してjqを使用してください。
よくある質問
TypeScriptでYAMLをパースするには?
js-yamlまたはyamlパッケージを使用してください。YAML文字列をパースして生成された型に代入:const config = yaml.parse(str) as MyConfig。ランタイム検証にはZodやio-tsを検討してください。
データはプライベートですか?
はい。生成は完全にブラウザ内で行われます。YAMLやコードはサーバーに送信されません。
オプショナルと必須フィールドは?
ジェネレーターはサンプルから推論します。オプショナルフィールドにはインターフェースプロパティに?を追加してください。厳密なランタイム検証には、生成された型を参照としてZodなどを使用してください。
AngularやReactで使えますか?
はい。生成された型はどのTypeScriptプロジェクトでも動作します。ビルド時またはランタイムでYAMLを読み込み、生成されたインターフェースにキャストしてください。環境設定には、ConfigサービスでYAMLを読み込むことを検討してください。