Multi-page app config with client-side routing

[ashen moth]

I have the following configuration for a multi-page app. The /foo/ path has client-side routing. However any path beyond /foo/ like /foo/bar/ or /foo/bar/baz/ loads the main app. What is the config magic to get any path beyond /foo/ to load the foo app?

build: {
  // where to build relative to source
  outDir: './../dist',
  // multi-page app config
  rollupOptions: {
    input: {
      main: resolve(__dirname, 'src/index.html'),
      foo: resolve(__dirname, 'src/foo/index.html'),
    },
  },
},

[coarse marsh]

Have you found a solution to this problem? 🙏 @ashen moth

[coarse marsh]

I do 😀

{
  name: 'special-spa-fallback',
  config() {
    return {
      appType: 'mpa'
    }
  },
  configureServer(server) {
    return () => {
      server.middlewares.use((req, res, next) => {
        if (req.originalUrl.startsWith('/nested/')) {
          req.url = '/nested/index.html';
        }
        next();
      });
    }
  }
}