Vike

You can deploy your Vike ↗ app to Cloudflare using the Vike extension vike-photon ↗.

All app types (SSR/SPA/SSG) are supported.

Already have a Vike project?

Run wrangler deploy in a project without a Wrangler configuration file and Wrangler will automatically detect Vike, generate the necessary configuration, and deploy your project.

npm yarn pnpm

npx wrangler deploy

yarn wrangler deploy

pnpm wrangler deploy

Learn more about automatic project configuration.

Vike Detected

Generated configuration

wrangler.jsonc

main: dist/server/index.js

wrangler.jsonc

assets: directory: dist/client

wrangler.jsonc

compatibility_flags: nodejs_compat

wrangler.jsonc

observability: enabled: true

Workers Deployed

Wrangler handles configuration automatically

What is Vike?

Vike ↗ is a Next.js/Nuxt alternative for advanced applications, powered by a modular architecture for unprecedented flexibility and stability.

New app

Use vike.dev/new ↗ to scaffold a new Vike app that uses vike-photon with @photonjs/cloudflare.

Add to existing app

1. npm yarn pnpm bun

   npm i wrangler vike-photon @photonjs/cloudflare

   yarn add wrangler vike-photon @photonjs/cloudflare

   pnpm add wrangler vike-photon @photonjs/cloudflare

   bun add wrangler vike-photon @photonjs/cloudflare

2. pages/+config.ts

   import type { Config } from 'vike/types'
   import vikePhoton from 'vike-photon/config'
   
   export default {
     extends: [vikePhoton]
   } satisfies Config

3. package.json

   {
     "scripts": {
       "dev": "vike dev",
       "preview": "vike build && vike preview",
       "deploy": "vike build && wrangler deploy"
     }
   }

   wrangler.jsonc

   {
     "$schema": "node_modules/wrangler/config-schema.json",
     "compatibility_date": "2025-08-06",
     "name": "my-vike-cloudflare-app",
     "main": "virtual:photon:cloudflare:server-entry",
     // Only required if your app depends a Node.js API
     "compatibility_flags": ["nodejs_compat"]
   }

4. .gitignore

   .wrangler/

5. (Optional) By default, Photon uses a built-in server that supports basic features like SSR. If you need additional server functionalities (e.g. file uploads ↗ or API routes ↗), then create your own server ↗.

Cloudflare APIs (bindings)

To access Cloudflare APIs (such as D1 and KV), use bindings which are available via the env object imported from cloudflare:workers.

TypeScript

import { env } from 'cloudflare:workers'
// Key-value store
env.KV.get('my-key')
// Environment variable
env.LOG_LEVEL
// ...

Example of using Cloudflare D1:

npm yarn pnpm

npm create vike@latest -- --react --hono --drizzle --cloudflare

yarn create vike --react --hono --drizzle --cloudflare

pnpm create vike@latest --react --hono --drizzle --cloudflare

Or go to vike.dev/new ↗ and select Cloudflare with an ORM.

TypeScript

If you use TypeScript, run wrangler types whenever you change your Cloudflare configuration to update the worker-configuration.d.ts file.

npm yarn pnpm

npx wrangler types

yarn wrangler types

pnpm wrangler types

Then commit:

git commit -am "update cloudflare types"

Make sure TypeScript loads it:

tsconfig.json

{
  "compilerOptions": {
    "types": ["./worker-configuration.d.ts"]
 }
}

See also: Cloudflare Workers > TypeScript.

See also

• Vike Docs > Cloudflare ↗