How to handle errors when a basePath is specified and requests are made outside it?

[OllyHodgson]

Hello,

I specify a basePath, e.g. { basePath: "/bff" } and any requests inside that base path are handled correctly. e.g. /bff/foo.

However, any request made outside that path (e.g. /foo, or something from the script kiddies like //bff/.env.example) throws with Error: No route matches URL "//bff/.env.example" (in router.ts).

Is there a good way to handle these requests? Or is this something I should handle further up the stack (e.g. in my nginx configuration)?

I already have both a root.tsx and a routes/$.tsx, both set up to return a 404 response.

(I'm on remix 2.8.1 (not using Vite), Node 20, remix-flat-routes 0.6.4)

Thank you!

[kiliman]

The way basePath works is that it just generates routes with that prefix added, so Remix isn't doing anything special. When it sees /foo, it looks to see if there's a route and, if not, throws a not found response.

Even though you have a route/$.tsx file, remix-flat-routes is treating it like you had a bff/$.tsx route, so that's why it's not catching the invalid routes. Also, the root route is only called if Remix finds a valid route to begin with.

However, you can manually define the splat route in your config file.

const { flatRoutes } = require('remix-flat-routes')

/**
 * @type {import("@remix-run/dev").AppConfig}
 */
module.exports = {
  // ignore all files in routes folder to prevent
  // default remix convention from picking up routes
  routes: async defineRoutes => {
    let routes = flatRoutes('routes', defineRoutes, {
      ignoredRouteFiles: ['**/*.test.{js,jsx,ts,tsx}', '**/__*.*'],
      basePath: '/bff',
    })
    let splatRoute = defineRoutes(route => route('*', 'routes/$.tsx'))
    return { ...routes, ...splatRoute }
  },
}

I would recommend that you migrate to Vite when you can as it now supports the basename option from React Router. The nice thing about this support is that it will automatically apply the base path to links as well.

[OllyHodgson]

Perfect, thank you @kiliman!

I basically only use remix-flat-routes for the basePath option. Would switching to Vite and using basename remove my need for this package?

[kiliman]

Yes. You would no longer need this package.