Skip to content
返回部署

部署 SolidStart 应用

细粒度响应式 SolidJS 应用,SolidStart 元框架,部署到 Vercel、Netlify、Cloudflare 或 Node。

平台进阶

为什么

SolidJS 用细粒度响应式(signals)无虚拟 DOM,接近原生性能。SolidStart 加文件路由、SSR 和服务端函数,部署适配器类似 Astro/Nuxt。

平台即服务采用率 2024 年增长 24%,团队从虚拟机管理转向 git push 部署。the cloud infrastructure market reached $330B in 2024, growing 22% year-over-year (Synergy Research),PaaS 层捕获了大多数新工作负载。

何时使用

性能关键且 React 重渲染模型是瓶颈的应用选 Solid。需要路由和 SSR 的全栈应用用 SolidStart。

如何做

1. 构建 — npm run build 输出 dist/(适配器特定) 2. Vercel — @solidjs/start/vercel 适配器,git push 自动部署 3. Netlify — @solidjs/start/netlify 适配器 4. Cloudflare — @solidjs/start/cloudflare,运行于 Workers 5. Node — @solidjs/start/node,运行 node dist/server/entry.mjs 6. 静态 — @solidjs/start/static 全 SSG 7. 服务端函数 — "use server" 指令创建 RPC 端点

示例

// app.config.ts — Vercel 适配器 import { defineConfig } from "@solidjs/start/config"; export default defineConfig({ ssr: true, adapter: "vercel", }); // src/routes/index.tsx — signal 组件 import { createSignal } from "solid-js"; export default function Home() { const [count, setCount] = createSignal(0); return <button onClick={() => setCount(c => c + 1)}>{count()}</button>; } // src/routes/api.ts — 服务端函数 "use server"; export async function getData() { return await db.query("SELECT * FROM items"); } // 部署:npm run build && vercel --prod

常见问题

  • ⚠水合不匹配 — signal 服务端客户端初始化不同,确保一致初始化
  • ⚠服务端函数未找到 — 忘记 'use server' 指令或导入路径错误
  • ⚠适配器未设 — 默认 Node,无正确适配器部署 Vercel/CF 失败

最佳实践

  • ✓用 createSignal/createMemo 管状态 — 避免 React 式 useState 模式丢失细粒度响应
  • ✓app.config 显式设适配器 — 生产部署不依赖自动检测
  • ✓设置健康检查和优雅关闭 — 处理 SIGTERM 以在退出前排空进行中的请求

常见问题解答