nuxt: Dynamic routes break when deploying built nuxt 3 app (boiler plate)

Environment

---

• Operating System: Windows_NT
• Node Version: v16.17.0
• Nuxt Version: 3.0.0-rc.11
• Nitro Version: 0.5.4
• Package Manager: npm@8.15.0
• Builder: vite
• User Config: -
• Runtime Modules: -
• Build Modules: -

---

Reproduction

I created a boiler plate nuxt 3 project like so:

npx nuxi init test-build cd test-build npm i

I then made a few small changes. In nuxt.config.js, I added:

ssr: false

I also added a pages folder, with a structure like so:

pages/products/[id].vue

Inside that file, I put:

<template>
  <div>
    <p>hello world</p>
  </div>
</template>

Finally, in app.vue, I changed it to:

<template>
  <div>
    <NuxtLayout>
      <NuxtPage />
    </NuxtLayout>
  </div>
</template>

Now, do an “npm run build”. I took the contents of the build (public output directory) and deployed it to an Azure static website (since ssr = false this should work). When navigating to a dynamic route like /products/123, you get a 404 even though the page shows “hello world” when running “npm run dev”.

Describe the bug

Dynamic routes show a 404 when deployed. I should note that non-dynamic routes (pages in the top level of the pages directory) load just fine.

Additional context

No response

Logs

No response