|
| 1 | +--- |
| 2 | +title: Develop locally with Containers and the Cloudflare Vite plugin |
| 3 | +description: The Cloudflare Vite plugin now supports configuring Containers in your Worker |
| 4 | +products: |
| 5 | + - workers |
| 6 | +date: 2025-07-22 |
| 7 | +--- |
| 8 | + |
| 9 | +import { WranglerConfig } from "~/components"; |
| 10 | + |
| 11 | +You can now configure and run [Containers](/containers) alongside your [Worker](/workers) during local development when using the [Cloudflare Vite plugin](/workers/vite-plugin/). Previously, you could only develop locally when using [Wrangler](/workers/wrangler/) as your local development server. |
| 12 | + |
| 13 | +#### Configuration |
| 14 | + |
| 15 | +You can simply configure your Worker and your Container(s) in your Wrangler configuration file: |
| 16 | + |
| 17 | +<WranglerConfig> |
| 18 | +```jsonc |
| 19 | +{ |
| 20 | + "name": "container-starter", |
| 21 | + "main": "src/index.js", |
| 22 | + "containers": [ |
| 23 | + { |
| 24 | + "class_name": "MyContainer", |
| 25 | + "image": "./Dockerfile", |
| 26 | + "instances": 5, |
| 27 | + "name": "hello-containers-go" |
| 28 | + } |
| 29 | + ], |
| 30 | + "durable_objects": { |
| 31 | + "bindings": [ |
| 32 | + { |
| 33 | + "class_name": "MyContainer", |
| 34 | + "name": "MY_CONTAINER" |
| 35 | + } |
| 36 | + ] |
| 37 | + }, |
| 38 | + "migrations": [ |
| 39 | + { |
| 40 | + "new_sqlite_classes": [ |
| 41 | + "MyContainer" |
| 42 | + ], |
| 43 | + "tag": "v1" |
| 44 | + } |
| 45 | + ], |
| 46 | +} |
| 47 | +``` |
| 48 | +</WranglerConfig> |
| 49 | + |
| 50 | +#### Worker Code |
| 51 | + |
| 52 | +Once your Worker and Containers are configured, you can access the Container instances from your Worker code: |
| 53 | + |
| 54 | +```ts |
| 55 | +import { Container, getContainer } from "@cloudflare/containers"; |
| 56 | + |
| 57 | +export class MyContainer extends Container { |
| 58 | + defaultPort = 4000; // Port the container is listening on |
| 59 | + sleepAfter = "10m"; // Stop the instance if requests not sent for 10 minutes |
| 60 | +} |
| 61 | + |
| 62 | +async fetch(request, env) { |
| 63 | + const { "session-id": sessionId } = await request.json(); |
| 64 | + // Get the container instance for the given session ID |
| 65 | + const containerInstance = getContainer(env.MY_CONTAINER, sessionId) |
| 66 | + // Pass the request to the container instance on its default port |
| 67 | + return containerInstance.fetch(request); |
| 68 | +} |
| 69 | +``` |
| 70 | + |
| 71 | +#### Local development |
| 72 | + |
| 73 | +To develop your Worker locally, start a local dev server by running |
| 74 | + |
| 75 | +```sh |
| 76 | +vite dev |
| 77 | +``` |
| 78 | + |
| 79 | +in your terminal. |
| 80 | + |
| 81 | +#### Resources |
| 82 | + |
| 83 | +Learn more about [Cloudflare Containers](https://developers.cloudflare.com/containers/) or the [Cloudflare Vite plugin](https://developers.cloudflare.com/workers/vite-plugin/) in our developer docs. |
0 commit comments