---
description: Get started with the Vite plugin
title: Get started
image: https://developers.cloudflare.com/og-docs.png
---

[Skip to content](#main-content)

> Documentation Index  
> Fetch the complete documentation index at: https://developers.cloudflare.com/workers/llms.txt  
> Use this file to discover all available pages before exploring further.

# Get started

Last updated Aug 25, 2026|Copy as Markdown|[View as Markdown](https://4f1c5cd2.previews.developers.cloudflare.com/workers/vite-plugin/get-started/index.md)|[Agent setup](https://4f1c5cd2.previews.developers.cloudflare.com/agent-setup/)

Note

This guide demonstrates creating a standalone Worker from scratch. If you would instead like to create a new application from a ready-to-go template, refer to the [TanStack Start](https://4f1c5cd2.previews.developers.cloudflare.com/workers/framework-guides/web-apps/tanstack-start/), [React Router](https://4f1c5cd2.previews.developers.cloudflare.com/workers/framework-guides/web-apps/react-router/), [React](https://4f1c5cd2.previews.developers.cloudflare.com/workers/framework-guides/web-apps/react/) or [Vue](https://4f1c5cd2.previews.developers.cloudflare.com/workers/framework-guides/web-apps/vue/) framework guides.

## Start with a basic `package.json`

```json
{
	"name": "cloudflare-vite-get-started",
	"private": true,
	"version": "0.0.0",
	"type": "module",
	"scripts": {
		"dev": "vite dev",
		"build": "vite build",
		"preview": "npm run build && vite preview",
		"deploy": "npm run build && wrangler deploy"
	}
}
```

Note

Ensure that you include `"type": "module"` in order to use ES modules by default.

## Install the dependencies

npmyarnpnpmbun

```
npm i -D vite @cloudflare/vite-plugin wrangler
```

```
yarn add -D vite @cloudflare/vite-plugin wrangler
```

```
pnpm add -D vite @cloudflare/vite-plugin wrangler
```

```
bun add -d vite @cloudflare/vite-plugin wrangler
```

## Create your Vite config file and include the Cloudflare plugin

```ts
import { defineConfig } from "vite";
import { cloudflare } from "@cloudflare/vite-plugin";

export default defineConfig({
	plugins: [cloudflare()],
});
```

The Cloudflare Vite plugin doesn't require any configuration by default and will look for a `wrangler.jsonc`, `wrangler.json` or `wrangler.toml` in the root of your application.

Refer to the [API reference](https://4f1c5cd2.previews.developers.cloudflare.com/workers/vite-plugin/reference/api/) for configuration options.

## Create your Worker config file

```jsonc
{
	"$schema": "./node_modules/wrangler/config-schema.json",
	"name": "cloudflare-vite-get-started",
	// Set this to today's date
	"compatibility_date": "2026-08-25",
	"main": "./src/index.ts"
}
```

```toml
"$schema" = "./node_modules/wrangler/config-schema.json"
name = "cloudflare-vite-get-started"
# Set this to today's date
compatibility_date = "2026-08-25"
main = "./src/index.ts"
```

The `name` field specifies the name of your Worker. By default, this is also used as the name of the Worker's Vite Environment (see [Vite Environments](https://4f1c5cd2.previews.developers.cloudflare.com/workers/vite-plugin/reference/vite-environments/) for more information). The `main` field specifies the entry file for your Worker code.

For more information about the Worker configuration, see [Configuration](https://4f1c5cd2.previews.developers.cloudflare.com/workers/wrangler/configuration/).

## Create your Worker entry file

```ts
export default {
	fetch() {
		return new Response(`Running in ${navigator.userAgent}!`);
	},
};
```

A request to this Worker will return **'Running in Cloudflare-Workers!'**, demonstrating that the code is running inside the Workers runtime.

## Dev, build, preview and deploy

You can now start the Vite development server (`npm run dev`), build the application (`npm run build`), preview the built application (`npm run preview`), and deploy to Cloudflare (`npm run deploy`).

Was this helpful?

YesNo

## On this page

[![](https://4f1c5cd2.previews.developers.cloudflare.com/_astro/logo.te5VL_aD.svg)Docs](https://4f1c5cd2.previews.developers.cloudflare.com/)

```json
{"@context":"https://schema.org","@type":"TechArticle","@id":"https://developers.cloudflare.com/workers/vite-plugin/get-started/#page","headline":"Get started · Cloudflare Workers docs","description":"Get started with the Vite plugin","url":"https://developers.cloudflare.com/workers/vite-plugin/get-started/","inLanguage":"en","image":"https://developers.cloudflare.com/og-docs.png","dateModified":"2026-08-25","publisher":{"@type":"Organization","name":"Cloudflare","description":"One platform for your apps, agents, and workforce. Build, secure, and scale without managing infrastructure","url":"https://www.cloudflare.com/","sameAs":["https://github.com/cloudflare","https://www.linkedin.com/company/cloudflare","https://x.com/cloudflare"],"logo":{"@type":"ImageObject","url":"https://developers.cloudflare.com/logo.svg"},"address":{"@type":"PostalAddress","streetAddress":"101 Townsend St","addressLocality":"San Francisco","addressRegion":"CA","postalCode":"94107","addressCountry":"US"},"contactPoint":[{"@type":"ContactPoint","contactType":"Customer Support","url":"https://support.cloudflare.com/","availableLanguage":["English"]},{"@type":"ContactPoint","contactType":"Sales","url":"https://www.cloudflare.com/contact/","availableLanguage":["English"]}]},"isPartOf":{"@type":"WebSite","@id":"https://developers.cloudflare.com/#website","name":"Cloudflare Docs","url":"https://developers.cloudflare.com/"}}
```