Vike

Last updated Jul 22, 2026 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.

npmyarnpnpm

npx wrangler deploy

yarn wrangler deploy

pnpm wrangler deploy

Learn more about automatic project configuration.

VikeDetected

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

WorkersDeployed

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. npmyarnpnpmbun

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

  1. pages/+config.tsdiff

```diff import type { Config } from 'vike/types' + import vikePhoton from 'vike-photon/config'

 export default {

  • extends: [vikePhoton] } satisfies Config ```

  • package.jsondiff

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

wrangler.jsoncdiff

diff + { + "$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"] + }

  1. .gitignorediff

diff + .wrangler/

  1. (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.

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

Example of using Cloudflare D1:

npmyarnpnpm

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.

npmyarnpnpm

npx wrangler types

yarn wrangler types

pnpm wrangler types

Then commit:

git commit -am "update cloudflare types"

Make sure TypeScript loads it:

tsconfig.jsondiff

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

See also: Cloudflare Workers > TypeScript.

See also

Was this helpful?

YesNo

On this page

Vike - 图1Docs

{"@context":"https://schema.org","@type":"TechArticle","@id":"https://developers.cloudflare.com/workers/framework-guides/web-apps/vike/#page","headline":"Vike","description":"Create a Vike application and deploy it to Cloudflare Workers","url":"https://developers.cloudflare.com/workers/framework-guides/web-apps/vike/","inLanguage":"en","image":"https://developers.cloudflare.com/workers/framework-guides/web-apps/vike/og.png?v=03ff0b22303f0ff3","dateModified":"2026-07-22","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/"},"keywords":["full-stack"]}

description: Create a Vue application and deploy it to Cloudflare Workers with Workers Assets. title: Vue image: https://developers.cloudflare.com/workers/framework-guides/web-apps/vue/og.png?v=55429edf634984fe

Skip to 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.