Netlify設定のTOMLからJSONへの変換

Netlifyのnetlify.tomlデプロイメント設定をJSONに変換します。ビルド設定、リダイレクト、ヘッダー、環境別コンテキスト、プラグイン設定を解説します。

Real-World Configs

詳細な説明

netlify.tomlはNetlifyデプロイメントの設定ファイルです。ビルドコマンド、リダイレクトルール、カスタムヘッダー、環境別のオーバーライドを定義します。そのJSON構造を理解することは、NetlifyのAPIの操作やプログラム的な設定生成に役立ちます。

典型的なnetlify.toml:

[build]
  command = "npm run build"
  publish = "dist"

[build.environment]
  NODE_VERSION = "20"
  NPM_FLAGS = "--legacy-peer-deps"

[context.production]
  command = "npm run build:prod"

[context.deploy-preview]
  command = "npm run build:preview"

[[redirects]]
  from = "/old-page"
  to = "/new-page"
  status = 301

[[redirects]]
  from = "/api/*"
  to = "https://api.example.com/:splat"
  status = 200
  force = true

[[headers]]
  for = "/*"
  [headers.values]
    X-Frame-Options = "DENY"
    X-Content-Type-Options = "nosniff"
    Cache-Control = "public, max-age=3600"

[[plugins]]
  package = "@netlify/plugin-lighthouse"
  [plugins.inputs]
    audits = ["performance", "accessibility"]

JSONに変換すると:

{
  "build": {
    "command": "npm run build",
    "publish": "dist",
    "environment": {
      "NODE_VERSION": "20",
      "NPM_FLAGS": "--legacy-peer-deps"
    }
  },
  "context": {
    "production": {
      "command": "npm run build:prod"
    },
    "deploy-preview": {
      "command": "npm run build:preview"
    }
  },
  "redirects": [
    {"from": "/old-page", "to": "/new-page", "status": 301},
    {"from": "/api/*", "to": "https://api.example.com/:splat", "status": 200, "force": true}
  ],
  "headers": [
    {
      "for": "/*",
      "values": {
        "X-Frame-Options": "DENY",
        "X-Content-Type-Options": "nosniff",
        "Cache-Control": "public, max-age=3600"
      }
    }
  ],
  "plugins": [
    {
      "package": "@netlify/plugin-lighthouse",
      "inputs": {
        "audits": ["performance", "accessibility"]
      }
    }
  ]
}

変換時の注目ポイント:

  • [[redirects]][[headers]][[plugins]] はすべてテーブル配列を使用し、JSON配列を生成します。
  • コンテキストオーバーライドは標準のネストされたテーブル([context.production])を使用し、環境名をキーとするJSONオブジェクトを作成します。
  • 配列内のサブテーブル[headers.values][plugins.inputs])は現在の配列要素にネストされたオブジェクトを追加します。
  • ビルド環境build セクション内のネストされたテーブルです。

NetlifyはJSON設定も直接サポートしているため、マッピングを理解することでシームレスな形式の切り替えが可能です。

ユースケース

CI/CDパイプラインからNetlifyデプロイメント設定を動的に生成する場合。リダイレクトルールやヘッダーがデータベースやAPIから計算され、TOMLまたはJSONとして書き出す必要がある場面で使用します。

試してみる — TOML ↔ JSON Converter

フルツールを開く