grainlet-adapters

部署Grainlet SSR应用到 Vercel 和 Cloudflare 使用网络 Request/Response 处理程序从 grainlet/ssr． 这个包裹放不下 平台api grainlet 核心。

npm install grainlet-adapters

同行: grainlet． 可选的对等: vite ( grainlet-adapters/vite）.

运行时

使用相同的 App + routes 对象作为Node的SSR模板。保持 /client.js 作为生产脚本的名称。

Vercel

import { createVercelHandler } from 'grainlet-adapters/vercel';
import { App, routes } from './App.jsx';

export default createVercelHandler({
  App,
  routes,
  document: { scripts: ['/client.js'] },
});

将该模块导出为函数入口。处理程序接受Web Request 和可选的Vercel上下文。

Cloudflare工人

import { createCloudflareHandler } from 'grainlet-adapters/cloudflare';
import { App, routes } from './App.jsx';

export default createCloudflareHandler({
  App,
  routes,
  document: { scripts: ['/client.js'] },
});

fetch(request, env, ctx) 通过 { env, ctx } 作为 platformContext。如果 env.ASSETS.fetch 存在时，首先提供静态文件；404失败了 苏维埃社会主义共和国。 npx wrangler deploy 从生成的Cloudflare输出目录中。

createGrainletHandler 是两个适配器使用的共享Web工厂。通过 assetPrefix (或 GRAINLET_ASSET_PREFIX)，当脚本不是同源时。 streaming: false 为不流的运行时缓冲HTML。

Vite构建输出

保持 grainJsx() 从 grainlet-vite． 添加 grainletPlatform() 到 苏维埃社会主义共和国 删除配置，使其在服务器包之后运行：

import { defineConfig } from 'vite';
import { grainJsx } from 'grainlet-vite';
import { grainletPlatform } from 'grainlet-adapters/vite';

export default defineConfig({
  plugins: [
    grainJsx(),
    grainletPlatform({
      target: 'vercel', // or 'cloudflare'
      clientOutDir: 'dist/client',
      prerender: true, // or ['/', '/about']
      App, // required when prerender is enabled
      routes,
    }),
  ],
  esbuild: { jsx: 'automatic', jsxImportSource: 'grainlet' },
  build: {
    outDir: 'dist/server',
    rollupOptions: {
      input: 'src/vercel.js',
      output: { entryFileNames: 'server.js' },
    },
    ssr: true,
  },
});

构建顺序: vite build --config vite.client.config.js 然后是SSR配置。

Vercel

下发布Build Output API v3 .vercel/output/：

• static/ -客户端资产和预渲染HTML
• functions/ssr.func/ -包装SSR包的边缘功能
• config.json -首先是文件系统路由，然后是全部捕获 /ssr

从项目根目录使用Vercel CLI进行部署(vercel deploy --prebuilt）.

Cloudflare

发出 dist/cloudflare/：

• assets/ -客户端文件和预渲染的HTML
• worker.js ——工人 fetch 出口
• wrangler.json - - - - - - main + assets 绑定 ASSETS

npx wrangler deploy --config dist/cloudflare/wrangler.json

动态路由留在SSR功能上。预呈现的路径是静态文件和 赢得所有人的支持。

的节点 createNodeHandler 模板保持默认值。 create-grainlet --ssr 起动器。指向战略科学军团的地点 input 在 src/vercel.js 或 src/cloudflare.js 当瞄准云时。