[suggestion] Add Cloudflare DevServer config to Docs

[bruceharrison1984]

My previous Hono app used the @hono/vite-dev-server package to setup local Cloudflare services. HonoX includes this, and it is all configured via the honox plugin, but the docs don't make this immediately obvious.

import { defineConfig } from 'vite';
import client from 'honox/vite/client';
import honox from 'honox/vite';
import pages from '@hono/vite-cloudflare-pages';

export default defineConfig(({ mode }) => {
  if (mode === 'client') {
    return {
      plugins: [client()],
    };
  } else {
    return {
      plugins: [
        honox({
          devServer: {
            cf: {
              d1Databases: { TORCH_DATABASE: 'TORCH_DATABASE' },
              d1Persist: '../../.wrangler/state/v3/d1',
              r2Buckets: ['TORCH_R2'],
              r2Persist: '../../.wrangler/state/v3/r2',
              kvNamespaces: ['TORCH_AUTH'],
              kvPersist: '../../.wrangler/state/v3/kv',
            },
          },
        }),
        pages(),
      ],
    };
  }
});

[yusukebe]

@bruceharrison1984

Ah, yeah. I also think these should be written. Can you write them and create a PR?

[bruceharrison1984]

Yeah, I should be able to carve out 30 minutes to put this together

[yusukebe]

Hey @bruceharrison1984

Now, we can use the new API getPlatformProxy() in Wrangler. This will automatically read variables from wrangler.toml without having to write Bindings in vite.config.ts. The vite.config.ts can be written simply as follows:

import honox from 'honox/vite'
import { defineConfig } from 'vite'
import { getPlatformProxy } from 'wrangler'

export default defineConfig(async () => {
  const { env, dispose } = await getPlatformProxy()
  return {
    plugins: [
      honox({
        devServer: {
          env,
          plugins: [
            {
              onServerClose: dispose
            }
          ]
        }
      })
    ]
  }
})

Below is an example project. Please try it out. If it looks good, write it in the README.

https://github.com/yusukebe/honox-playground/tree/main/projects/cloudflare-bindings

[KaiSpencer]

Happy to throw something in the docs if you are stuck for time @bruceharrison1984 👌

[bruceharrison1984]

Go for it man! I won't have time to swing back to this until next week.

[yusukebe]

I've updated the website to explain a new way of using Cloudflare Bindings:

https://hono.dev/getting-started/cloudflare-pages#bindings

I think we can add the description to HonoX's README like that.

[yusukebe]

This was fixed by https://github.com/honojs/honox/pull/113