Can't get devServer to work with Qwik & vite-cloudflare-pages

[gregory]

Hello guys, I'm trying to get a devServer to work with Qwik & Cloudflare pages to render both my Qwik app & my api endpoints under a /functions folder.

Hopefully I'm doing something wrong and there is no bug :) Thanks in advance for the help and thank you @yusukebe for your awesome contributions! 🙏

dev/vite.config.ts:

import { extendConfig } from "@builder.io/qwik-city/vite";
import pages from '@hono/vite-cloudflare-pages'
import baseConfig from "../../vite.config";
import devServer from '@hono/vite-dev-server'
import { getPlatformProxy } from 'wrangler'
import build from '@hono/vite-cloudflare-pages'

export default extendConfig(baseConfig, async ({mode}) => {
    const {env, dispose} = await getPlatformProxy()
    return {
      plugins: [
        devServer({
          adapter:cloudflarePagesAdapter,
          entry: 'src/entry.hono.tsx',
          plugins: [
            { onServerClose: dispose, env },
            pages({ bindings: { NAME: 'Hono', } }),
          ],
        })
      ]
    }
});

vite.config.ts:

 * This is the base config for vite.
 * When building, the adapter config is used which loads this file and extends it.
 */
import { defineConfig, type UserConfig } from "vite";
import { qwikVite } from "@builder.io/qwik/optimizer";
import { qwikCity } from "@builder.io/qwik-city/vite";
import tsconfigPaths from "vite-tsconfig-paths";
import pkg from "./package.json";

const { dependencies = {}, devDependencies = {} } = pkg as any as {
  dependencies: Record<string, string>;
  devDependencies: Record<string, string>;
  [key: string]: unknown;
};

/**
 * Note that Vite normally starts from `index.html` but the qwikCity plugin makes start at `src/entry.ssr.tsx` instead.
 */
export default defineConfig(({ command, mode }): UserConfig => {
  return {
    plugins: [qwikCity(), qwikVite(), tsconfigPaths()],
    // This tells Vite which dependencies to pre-build in dev mode.
    optimizeDeps: {
      // Put problematic deps that break bundling here, mostly those with binaries.
      // For example ['better-sqlite3'] if you use that in server functions.
      exclude: [],
    },
    // This tells Vite how to bundle the server code.
    ssr:
      command === "build" && mode === "production"
        ? {
            // All dev dependencies should be bundled in the server build
            noExternal: Object.keys(devDependencies),
            // Anything marked as a dependency will not be bundled
            // These should only be production binary deps (including deps of deps), CLI deps, and their module graph
            // If a dep-of-dep needs to be external, add it here
            // For example, if something uses `bcrypt` but you don't have it as a dep, you can write
            // external: [...Object.keys(dependencies), 'bcrypt']
            external: Object.keys(dependencies),
          }
        : undefined,
    server: {
      headers: {
        // Don't cache the server response in dev mode
        "Cache-Control": "public, max-age=0",
      },
    },
    preview: {
      headers: {
        // Do cache the server response in preview (non-adapter production build)
        "Cache-Control": "public, max-age=600",
      },
    },
  };
});

src/entry.hono.tsx:

import { manifest } from "@qwik-client-manifest";
import render from "./entry.ssr";

import { qwikMiddleware } from '@hono/qwik-city'
import { Hono } from 'hono'
import { logger } from 'hono/logger'
import { showRoutes } from 'hono/dev'
const app = new Hono()
app.get('*', logger())

app.use('*', qwikMiddleware({ render, qwikCityPlan, manifest}))
app.get('/bar', () => {
  return new Response("Hello, world from hono!");
})

showRoutes(app)

export default app
export const { fetch } = app

here is the error I'm seeing starting the server:

    at shim (/Users/greg/src/github.com/homelifedata/qwik/node_modules/@builder.io/qwik-city/index.qwik.mjs:165:34)
    at AsyncFunction.RouterOutlet_component_e0ssiDXoeAM (/Users/greg/src/github.com/homelifedata/qwik/node_modules/@builder.io/qwik-city/index.qwik.mjs:185:24)
    at AsyncFunction.invokeApply (/Users/greg/src/github.com/homelifedata/qwik/node_modules/@builder.io/qwik/core.mjs:3627:22)
    at AsyncFunction.invoke (/Users/greg/src/github.com/homelifedata/qwik/node_modules/@builder.io/qwik/core.mjs:3620:22)
    at eval (/Users/greg/src/github.com/homelifedata/qwik/node_modules/@builder.io/qwik/core.mjs:7206:25)
    at maybeThen (/Users/greg/src/github.com/homelifedata/qwik/node_modules/@builder.io/qwik/core.mjs:388:54)
    at eval (/Users/greg/src/github.com/homelifedata/qwik/node_modules/@builder.io/qwik/core.mjs:7192:14)
    at eval (/Users/greg/src/github.com/homelifedata/qwik/node_modules/@builder.io/qwik/core.mjs:1019:25)
    at safeCall (/Users/greg/src/github.com/homelifedata/qwik/node_modules/@builder.io/qwik/core.mjs:377:21)
    at executeComponent (/Users/greg/src/github.com/homelifedata/qwik/node_modules/@builder.io/qwik/core.mjs:1019:10) {
  hostElement: <ref *1> MockElement {
    nodeType: 111,
    _qc_: {
      '$flags$': 4,
      '$id$': '',
      '$element$': [Circular *1],
      '$refMap$': [],
      li: [],
      '$tasks$': null,
      '$seq$': null,
      '$slots$': [],
      '$scopeIds$': null,
      '$appendStyles$': null,
      '$props$': {},
      '$vdom$': null,
      '$componentQrl$': [AsyncFunction],
      '$contexts$': null,
      '$dynamicSlots$': null,
      '$parentCtx$': [Object],
      '$realParentCtx$': [Object]
    }
  }
}