Документация Запланировать пилот

Vike

Можно развернуть ваш Vike ↗ приложение в Cloudflare с помощью расширения Vike vike-photon ↗.

Поддерживаются все типы приложений (SSR/SPA/SSG).

узел Framework
VikeОбнаружено
Коннектор: Framework to Config
элементы конфигурации
Сгенерированная конфигурация
wrangler.jsonc
main:dist/server/index.js
wrangler.jsonc
assets:directory: dist/client
wrangler.jsonc
compatibility_flags:nodejs_compat
wrangler.jsonc
наблюдаемость:enabled: true
Коннектор: Config to Workers
WorkersРазвернуто
Индикатор статуса
Wrangler настраивает конфигурацию автоматически

Что такое Vike?

Vike ↗ это альтернатива Next.js/Nuxt для сложных приложений, построенная на модульной архитектуре, обеспечивающей исключительную гибкость и стабильность.

Новое приложение

Используйте vike.dev/new ↗ чтобы создать каркас нового приложения Vike, использующего vike-photon с @photonjs/cloudflare.

Добавить в существующее приложение

  1. npm i 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. (Необязательно) По умолчанию Photon использует встроенный сервер, который поддерживает базовые функции, например SSR. Если требуются дополнительные серверные функции (например, загрузка файлов ↗ или Маршруты API ↗), затем создайте собственный сервер ↗.

API Cloudflare (привязки)

Чтобы получить доступ к API Cloudflare (например, D1 и KV), используйте привязки которые доступны через env объект импортируется из cloudflare:workers.

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

Пример использования Cloudflare D1:

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

Или перейдите к vike.dev/new ↗ и выберите Cloudflare с ORM.

TypeScript

Если вы используете TypeScript, выполните wrangler types каждый раз, когда вы изменяете конфигурацию Cloudflare, чтобы обновить worker-configuration.d.ts файл.

npx wrangler types

Затем закоммитьте изменения:

git commit -am "update cloudflare types"

Убедитесь, что TypeScript загружает его:

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

См. также: Cloudflare Workers > TypeScript.

См. также

Запросите бесплатный пилот

Запланировать пилот