remix cloudflare 如何支持workflow

CN
jiangsi
2025-03-07 19:58:33

背景:

我最常用的技术栈是 remix +cloudflare workers

remix作为全栈框架,心智简单,性能优异,没有特别多的魔法。

cloudflare 作为赛博菩萨,我也推荐过很多次了。

本次是由于我希望尝试一下cloudflare workflow ,进一步尝试一下cloudflare 的agents 。

测试demo写完,准备开始在项目中实际使用,这时候发现这个技术栈不支持。

原因是:

一、remix cloudflare 使用的本地dev 的runtime 是 wrangler 客户端所包含的miniflare ,build时候的命令

remix vite:build

也要依赖miniflare ,miniflare 不支持在wrangler.toml中的[[workflow]] 标记

二、miniflare + remix-run/dev中的 cloudflareDevProxyVitePlugin ,可以通过proxy把wrangler 的常用功能给代理过去,但是不支持最新workflow

build 的时候会报错,

Worker “workflows:workflows-starter”'s binding “USER_WORKFLOW” refers to service “core:user:” with a named entrypoint “MyWorkflow”, but “core:user:” has no such named entrypoint. MiniflareCoreError [ERR_RUNTIME_FAILURE]: The Workers runtime failed to start. There is likely additional logging output above. at Miniflare2.#assembleAndUpdateConfig (/home/code/cf/aiedgeblog/node_modules/miniflare/src/index.ts:1404:10) at processTicksAndRejections (node:internal/process/task_queues:105:5) at Mutex.runWith (/home/code/cf/aiedgeblog/node_modules/miniflare/src/workers/shared/sync.ts:66:45) at Miniflare2.#waitForReady (/home/code/cf/aiedgeblog/node_modules/miniflare/src/index.ts:1486:3) at Miniflare2._getProxyClient (/home/code/cf/aiedgeblog/node_modules/miniflare/src/index.ts:1692:3) at Miniflare2.getBindings (/home/code/cf/aiedgeblog/node_modules/miniflare/src/index.ts:1715:23) at getPlatformProxy (/home/code/cf/aiedgeblog/node_modules/wrangler/wrangler-dist/cli.js:180408:20) at configureServer (/home/code/cf/aiedgeblog/node_modules/@remix-run/dev/dist/vite/cloudflare-proxy-plugin.js:55:11) at _createServer (file:///home/code/cf/aiedgeblog/node_modules/vite/dist/node/chunks/dep-CB_7IfJ-.js:63080:20) at configResolved (/home/code/cf/aiedgeblog/node_modules/@remix-run/dev/dist/vite/plugin.js:768:27) { code: ‘ERR_RUNTIME_FAILURE’, cause: undefined

三、remix官方react router 正在不断的迭代其 框架lib一体化的 reacr router 7,目前来到了7.3.0版本,基本上把remix所有的功能都移植进去了。没空再回来搞remix 命令。(新的命令是react-router build ,react-router dev)

四、cloudflare 的最新的开发客户端wrangler 3.0 中的 runtime已经不是miniflare了,而是workerd ,workerd可以做到和线上workers 100%的兼容性。并且官方提供了一个 @cloudflare/vite-plugin 的包,可以方便的和vite进行集成,最新的agents 和 workflow的demo中都是用的这个包。

五 以上的几个包没有能组合在一起的template

好吧,我就尝试的组合了一个,目前的情况是。

新的template

使用react router 7.3 + @cloudflare/vite-plugin

通过vite 进行本地开发使用,

react-router dev 支持热更新,支持获得cloudflare 资源,包括env kv

发布 npm run build && wrangler deploy --config=wrangler.prod.toml

准备两个配置文件wrangler.prod.toml 和wrangler.toml

一个用于本地开发,一个用于线上发布。

不太完美

新的这组合,估计react router 或者cloudflare 两边谁在稍微开发一下,估计就完美了。

目前的缺陷。

react router 中的 准备接cf request 的handler 使用了virtual:react-router/server-build

const requestHandler = createRequestHandler(
  // @ts-expect-error
  () => import("virtual:react-router/server-build"),
  import.meta.env.MODE
);

而这个方法, react-router dev 和 react-router build 都支持。但是wrangler deploy不支持。

但是他们又都依赖wrangler.toml 所以我现在将本地开发调试使用wrangler.tom .而线上指向了build后的文件。就可以解决这个问题了。

在看看后续的发展发变化吧。本地template的地址是

https://github.com/jiangsi/vite-plugin-cloudflare-template

这样就可以通过 @cloudflare/vite-plugin 支持workflow 了