Skip to content
Cloudflare Docs

WranglerConfig

The WranglerConfig component is used 430 times on 240 pages.

See all examples of pages that use WranglerConfig

Used 430 times.

Pages

Partials

This component can be used to automatically generate a jsonc version of the toml file (or vice versa) of the Cloudflare Wrangler configuration file.

Import

import { WranglerConfig } from "~/components";

Usage

{
  "$schema": "./node_modules/wrangler/config-schema.json",
  "d1_databases": [
    {
      "binding": "DB",
      "database_name": "prod-d1-tutorial",
      "database_id": "<unique-ID-for-your-database>"
    }
  ]
}
 
import { WranglerConfig } from "~/components";


<WranglerConfig>
```toml
[[d1_databases]]
binding = "DB" # available in your Worker on env.DB
database_name = "prod-d1-tutorial"
database_id = "<unique-ID-for-your-database>"
```
</WranglerConfig>

A $today value can be used in this component to automatically insert the today's date. This is useful for suggesting that users set the latest compatibility date.

{
  "name": "my-worker",
  "compatibility_date": "2025-11-10"
}
 
import { WranglerConfig } from "~/components";


<WranglerConfig>
```jsonc
{
  "name": "my-worker",
  "compatibility_date": "$today"
}
```
</WranglerConfig>

The removeSchema prop can be used to remove the $schema reference from the generated JSON file. This can be useful if you want to add snippets of configuration files that are easier to copy paste, and are providing toml as the source config format.

If you provide jsonc as the source config format, the removeSchema prop will be ignored.

{
  "d1_databases": [
    {
      "binding": "DB",
      "database_name": "prod-d1-tutorial",
      "database_id": "<unique-ID-for-your-database>"
    }
  ]
}
 
import { WranglerConfig } from "~/components";


<WranglerConfig removeSchema>
```toml
[[d1_databases]]
binding = "DB" # available in your Worker on env.DB
database_name = "prod-d1-tutorial"
database_id = "<unique-ID-for-your-database>"
```
</WranglerConfig>