IPX images not found when setting nitro.static to true in development

When using the default IPX provider and setting nitro.static to true in nuxt.config.ts, images will not be found in development. However, images are correctly generated when running nuxt build and there are no issues in production.

Reproduction: https://stackblitz.com/edit/github-f66jbi?file=nuxt.config.ts

nuxt.config.ts

// https://nuxt.com/docs/api/configuration/nuxt-config
export default defineNuxtConfig({
  srcDir: 'src',
  devtools: { enabled: false },

  app: {
    head: {
      title: 'Nuxt Image Example',
    },
  },

  modules: ['@nuxtjs/tailwindcss', '@nuxt/image'],
  compatibilityDate: '2024-07-03',

  nitro: {
    // BUG: when setting to true, ipx image path will not be found during dev
    static: true,
  },
});

Console error

[Vue Router warn]: No match found for location with path "/_ipx/f_jpeg&s_2048x1366/images/mountains_2.jpg"

Workaround

The current solution is to dynamically set nitro.static to false during development

nitro: {
  static: process.env.NODE_ENV !== 'development',
},

Expectation

Using nitro.static setting should not be causing issue during development

@pi0 do you think that this is the issue on the nitro or the module side?

I also have a static app facing the same issue (Nuxt 3.15.1). When nitro: static is set to true, no images are shown during development when using NuxtImage. Setting it to false led to loading the application before crashing while trying to insert images in the half rendered app and rendering the app unroutable with the following error messages:

 ERROR  [unhandledRejection] socket hang up                                                                                                                                                 
    at Socket.socketOnEnd (node:_http_client:536:25)
    at Socket.emit (node:events:525:35)
    at endReadableNT (node:internal/streams/readable:1696:12)
    at process.processTicksAndRejections (node:internal/process/task_queues:90:21)

 ERROR  [unhandledRejection] connect ECONNREFUSED 127.0.0.1:40229                                                                                                                           
    at TCPConnectWrap.afterConnect [as oncomplete] (node:net:1634:16)

so I need to keep it set to true..

Another workaround is to use native environment overrides

export default defineNuxtConfig({
  ...
  $production: {
    nitro: true
  },
})