Cloudflare 开源 Void:Vite 全栈开发平台、SDK 与 CLI 三件套
Deploy with Void
Cloudflare 将 VoidZero 的 Void Platform、Void SDK、Void CLI 三个产品开源,以单个 npm 包和 Vite 插件形式发布,把服务端路由、类型化数据访问和 Cloudflare 部署统一进 Vite 工作流。
VoidZero 的工具,如 Vite、Vitest、Oxc 和 Rolldown——打包在一个工具链中,即 Vite+ ——让前端开发变得更快,但构建全栈应用需要的不仅仅是一套工具链。这些应用需要服务端路由、数据库、本地开发环境,以及一种快速简便的方式将想法部署到生产环境。
我们很高兴开源三款新产品,将服务端路由、类型化数据访问和 Cloudflare 部署带入统一的 Vite 工作流。
- Void Platform: 一个共享部署平台,供团队在 Cloudflare 上托管 Void 应用。
- Void SDK: 一个可组合的 JavaScript SDK,用于使用 Vite 构建全栈应用。
- Void CLI: 一个 CLI,用于预置资源并将 Vite 应用部署到 Cloudflare。
CLI 将使用 SDK 构建的应用部署到 Platform。三款产品均以单个 JavaScript 包和 Vite 插件的形式开源,你可以通过 npm install void 安装。借助 Void,你可以同时构建服务端和客户端,将类型从数据库传递到 UI,并让 Void 自动预置应用所使用的 Cloudflare 资源。
我们最初的目标是构建一个单一的私有平台,供所有用户部署应用。在 VoidZero 加入 Cloudflare 之后,我们调整了方向,将该平台开源并允许任何人安装,因为我们看到了一个日益增长的需求:公司希望鼓励 vibe 编码的内部应用,但又担心安全问题,不想给每位员工都授予云访问权限。Void 解决了这个问题。
Void Platform:面向你公司的云平台
Void Platform 完全开源,你可以 fork 它并根据需求进行调整,集成公司系统、自定义部署工作流、为客户构建功能,或使其在其他部署平台上运行。你可以直接按原样使用该平台、向上游贡献改进,或 fork 后只构建你需要的功能。开源代码可以开箱即用,也可作为起点。
作为 Void Platform 的管理员,你可以控制访问权限、设置资源限制、通过 Void CLI 或管理仪表盘检查部署和使用情况,并提供防护措施,让其他所有人都能将正式应用和 vibe 编码的应用发布到同一个共享平台。
通过安装 Void Platform,你的团队或客户可以在你的 Cloudflare 账户中、基于 Workers for Platforms 拥有一个共享部署环境。Void Platform 支持:
- 更快的原型开发。你的团队可以快速构建原型、部署并分享可用的应用以获取反馈,而无需为每个项目单独设置 Cloudflare 账户或预置资源。这将内部应用的上线时间从数天/数周缩短到数分钟。
- 非技术团队也能构建。这一工作流还让通常不写代码的同事能够借助编码智能体构建并分享自己的应用。设计师可以创建交互式原型,运营同事可以构建内部仪表盘,然后将其部署到同一平台。所有这些都在适当的安全措施下进行。
要自托管 Void 平台,你需要:
- 一个启用了 Workers for Platforms 和 R2 的 Cloudflare 账户
- 一个 PostgreSQL 数据库
- 一个你所选登录提供商的账户
- 一个用于你的应用的域名
然后通过运行一条命令将 Void 安装为云平台:
平台搭建完成后,已获批准的用户可以通过 Void CLI 连接到平台进行部署。
void connect https://api.orange-company.dev
用户使用 Void SDK 构建应用,Void Platform 的身份验证、框架检测、资源预配等优势正是由它驱动的。换句话说,Void Platform 之所以能工作,全靠配套的 SDK 和 CLI。
Void SDK:零配置基础设施
Void 可将 Vite 应用转变为全栈 Cloudflare Workers 应用。你或你的智能体可以编写代码,Void 会在部署期间自动推断资源绑定并预配数据库、队列或 AI 绑定等资源。
要开始使用,请将 Void 添加为 Vite 插件:
import { defineConfig } from "vite";
import { voidPlugin } from "void";
import { voidReact } from "@void/react/plugin";
export default defineConfig({
plugins: [voidPlugin(), voidReact()],
});
Void SDK 附带适用于 React 和 Vue 等流行 JavaScript UI 框架的适配器,提供基于文件的路由、预渲染、缓存、孤岛(islands),以及从数据库到 UI 的端到端类型安全。
Void 的所有功能都是可选的、可组合的。Void 可与 Vinext、React Router、SvelteKit、Nuxt、TanStack Start 和 Astro 等现有应用框架集成。你可以用这些框架处理路由和渲染,而 Void 则使用 Hono 处理资源 API、迁移、部署,并通过 Better Auth 处理身份验证。
让我们来看一个构建服务端渲染页面的示例,类型从数据库查询一直推断到客户端:
// pages/blog.server.ts
import { defineHandler, type InferProps } from 'void';
import { db } from 'void/db';
import { posts } from '@schema';
export const loader = defineHandler(async () => ({
posts: await db.select().from(posts),
}));
export type Props = InferProps<typeof loader>;
// pages/blog.tsx
export default function Blog({ posts }: Props) {
return (
<ul>
{posts.map((post) => <li key={post.id}>{post.title}</li>)}
</ul>
);
}
通过导入 void/db,Void 会在开发期间为你的应用提供本地数据库,并在生产环境中让 void deploy 自动为你预配 D1。这同样适用于通过 Cloudflare 的 AI Gateway 使用 AI:只需导入 void/ai,一切都会自动为你配置好。
// routes/api/decide.ts
import { defineHandler } from 'void';
import { ai } from 'void/ai';
export const POST = defineHandler(async (c) => {
const { question } = await c.req.json();
const result = await ai.run('@cf/cloudflare/clef', {
model: 'clef',
state: {},
questions: {
decision: { type: 'noul', instructions: question },
},
});
const probability = result.answers.decision.noul;
return c.json({
answer: probability >= 0.5 ? 'yes' : 'no',
probability,
});
});
Void 的 React 路由专为 Async React 打造,利用 transitions 和 Suspense 实现跨屏幕的响应式导航。当你将此路由与 fate 等现代数据框架以及 Astryx 等 UI 库搭配使用时,你可以通过 React 的 transitions 协调导航、数据获取和变更,并在整个应用中实现 actions 和乐观更新。这些部分结合在一起,让你构建的应用在快速网络上感觉是同步的,在较慢网络上也能优雅降级,并在开销较大的渲染更新期间保持交互响应。
如果用户不需要 Void Platform 的团队管理功能,可以使用自己的 Cloudflare 账户。Void SDK 也可直接部署到 Cloudflare。
Void CLI:一条部署命令
Void CLI 是 Void 的主要接口。CLI 负责管理平台并部署应用。它构建于新的 cf CLI 之上,与智能体配合良好。
使用 Void CLI,你可以让智能体调试失败的请求、读取部署日志、分析应用运行表现,或让它们为你部署完成的应用,从而负责整个生命周期。
应用准备好部署到 Cloudflare 后,你可以运行:
首次运行 void deploy 时,CLI 会提示你登录 Cloudflare 账户。Void 使用 Vite 构建应用、应用迁移、自动预配资源,并部署到 Cloudflare 或 Void Platform。它可用于处理项目的完整生命周期,例如构建、部署以及管理资源和项目,例如:
与 CLI(以及由此扩展的智能体)可以管理 Void 应用整个生命周期类似,你也可以使用 CLI 管理 Void Platform:
- 管理用户、项目访问权限和资源
- 检查部署、日志和回滚
- 监控平台健康状况和使用情况
联系我们
VoidZero 的使命是让 JavaScript 开发者的生产力达到前所未有的高度。我们将 Vite、Rolldown、Oxlint、Oxfmt 和 Vitest 整合到 Vite+ 中,用于开发、打包、代码质量和测试。Void 将该技术栈扩展到全栈应用开发,让你和你的智能体能够构建、测试和部署完整的应用。
过去几个月里,我们一直在 VoidZero 的生产环境中使用 Void SDK、CLI 和 Platform,我们很期待看到你用 Void 构建出什么。请与我们分享你的反馈:
- Discord:加入 Void 社区 Discord 服务器 进行实时讨论
- GitHub:为仓库加星、发起讨论并报告问题
- 使用 Void 部署应用:快速入门指南
- X / Bluesky:在 X 上关注 VoidZero 获取最新动态 或在 Bluesky 上关注
来源:Cloudflare Blog · blog.cloudflare.com