"Remix (with Vite and Cloudflare)" template suffers multiple issues in dev mode (hard refresh, <Form> hard refresh, ..)

[wouterds]

Reproduction

As described in the title, the issue happens when running npm run dev (remix vite:dev) script.

I did create a basic reproduction example with a few pages using the Cloudflare template, which works fine when deployed to Cloudflare Pages, but not locally in dev mode.

Used command to generate project: npx create-remix@latest --template remix-run/remix/templates/cloudflare.

Problems:

• when clicking a page the page always hard refreshes (in dev mode)
• when submitting the form it's being submitted with a full page load (in dev mode)

Both problems do not occur on the deployment to Cloudflare Pages.

• Repository: https://github.com/wouterds/my-remix-app
• Demo deployment: https://6239ed74.my-remix-app-1no.pages.dev

System Info

System:
    OS: macOS 14.4.1
    CPU: (8) arm64 Apple M2
    Memory: 89.19 MB / 16.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 18.20.2 - ~/.nvm/versions/node/v18.20.2/bin/node
    npm: 10.5.0 - ~/.nvm/versions/node/v18.20.2/bin/npm
    Watchman: 2023.11.13.00 - /opt/homebrew/bin/watchman
  Browsers:
    Chrome: 124.0.6367.156
    Safari: 17.4.1
  npmPackages:
    @remix-run/cloudflare: ^2.9.1 => 2.9.1 
    @remix-run/cloudflare-pages: ^2.9.1 => 2.9.1 
    @remix-run/dev: ^2.9.1 => 2.9.1 
    @remix-run/react: ^2.9.1 => 2.9.1 
    vite: ^5.1.0 => 5.2.11

Used Package Manager

npm

Expected Behavior

Soft navigation & soft form submission (as when deployed to CF Pages).

Actual Behavior

Hard refreshes, navigation & form submission (dev mode).

https://github.com/remix-run/remix/assets/1210628/9d9cd9e9-51db-4728-93bb-5eca68031dae

[alcpereira]

I have encountered the same issue without any template. Also only happens in dev mode.