When router.base is set in the nuxt config the server will not build/preview correctly.

[jaysaurus]

Environment

• Operating System: Linux
• Node Version: v18.12.1
• Nuxt Version: 2.16.3
• Nitro Version: 2.4.1
• Package Manager: yarn@1.22.19
• Builder: webpack
• User Config: axios, head, loading, css, plugins, buildModules, modules, i18n, build, router, serverHandlers, devServerHandlers, devServer, typescript, nitro, bridge
• Runtime Modules: cookie-universal-nuxt@2.2.2, nuxt-i18n@6.28.1
• Build Modules: (), @nuxtjs/axios@5.13.6, @nuxt/bridge@3.0.0-28071266.dab55db

Reproduction

Similar to #513 (and in-addition-to, because you will also see hotloading issues in my attached project if you run it locally via nuxi dev)

When router.base is set in the nuxt config the server will not build/preview correctly.

1. using a blank nuxt project, set your router base to "/foo" in nuxt.config
2. run nuxi build
3. run nuxi preview
4. navigate to /foo/whatever-page/bah

webpack chunks will fail. this can be demo'd by adding images and attempting to reference them in vue components. (see my bridge project below)

Describe the bug

I cannot create a project that will reproduce this issue with your sandboxes because I needed to add an image and they wouldn't let me. I therefore attach a bare-bones imitation here: https://github.com/jaysaurus/nuxt-bridge-build-bug

server will display

[nuxt] [request error] [unhandled] [404] This page could not be found
  at createError (./server/node_modules/h3/dist/index.mjs:128:15)  
  at Server.toNodeHandle (./server/node_modules/h3/dist/index.mjs:1332:21)  
  at process.processTicksAndRejections (node:internal/process/task_queues:95:5)

while the debug of the client will have similar messages as follows:

Furthermore, any assets served in /assets will fail to load.

in my project, try building, deploying and then navigating to http://localhost:3000/foo/bah/etc (note that it'll load an image with the hot server but it wont load when deployed.) You can also use this page to evidence that hot loading simply wont work when you run nuxi dev and save changes as per the aforementioned issue.

Additional context

Build has the following warning:

[15:42:51]  WARN  Export "useNitroApp" of module "node_modules/nitropack/dist/runtime/app.mjs" was reexported through module "node_modules/nitropack/dist/runtime/index.mjs" while both modules are dependencies of each other and will end up in different chunks by current Rollup settings. This scenario is not well supported at the moment as it will produce a circular dependency between chunks and will likely lead to broken execution order.
Either change the import in "node_modules/@nuxt/bridge/dist/runtime/nitro/renderer.mjs" to point directly to the exporting module or reconfigure "output.manualChunks" to ensure these modules end up in the same chunk.

I note that nitro has patched this recently, it may be that nuxt bridge needs to do likewise. Not 100% on whether this might lead to problematic behaviour but wouldn't hurt to resolve.

Logs

Listening http://[::]:3000/foo
[nuxt] [request error] [unhandled] [404] This page could not be found
  at createError (./server/node_modules/h3/dist/index.mjs:128:15)  
  at Server.toNodeHandle (./server/node_modules/h3/dist/index.mjs:1332:21)  
  at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
[nuxt] [request error] [unhandled] [404] This page could not be found
  at createError (./server/node_modules/h3/dist/index.mjs:128:15)  
  at Server.toNodeHandle (./server/node_modules/h3/dist/index.mjs:1332:21)  
  at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
[nuxt] [request error] [unhandled] [404] This page could not be found
  at createError (./server/node_modules/h3/dist/index.mjs:128:15)  
  at Server.toNodeHandle (./server/node_modules/h3/dist/index.mjs:1332:21)  
  at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
[nuxt] [request error] [unhandled] [404] This page could not be found
  at createError (./server/node_modules/h3/dist/index.mjs:128:15)  
  at Server.toNodeHandle (./server/node_modules/h3/dist/index.mjs:1332:21)  
  at process.processTicksAndRejections (node:internal/process/task_queues:95:5)

[Towerism]

router.base has been broken with nuxt bridge for months. I recently found a work around though. It's really nasty, but at least with this we don't have to wait any longer for a fix.

We have a nuxt module, and within it we added this code:

      nuxt.options.app.baseURL = baseURL
      // router.base option is borked
      // this is a workaround to achieve the same functionality
      nuxt.hook('build:templates', ({ templateVars }) => {
        templateVars.router = { ...templateVars.router, base: baseURL }
      })
      nuxt.hook('webpack:config', (configs) => {
        const clientConfig = configs.find((c) => c.name === 'client')
        clientConfig.output.publicPath = baseURL + '_nuxt/'
      })

And we also removed the router.base option.