routes with + in a S3 bucket are causing issues with Remix trying to resolve these chunks

[alexhoo]

Im trying to upload static assets from Remix to a S3 Bucket from Aws (public/build). The problem is that S3 is not friend of characters like + in the url. Since most of my Remix paths contains this + character, is there any way to deal with this situation? Im using Remix + Express layer.

[kiliman]

Interesting. I guess I can understand since, technically, a + in the URL is translated to a space.

Try adding this to your remix.config.js

  routes: async defineRoutes => {
    const routes = flatRoutes('routes', defineRoutes)
    // remove + in route ids
    const newRoutes = {}
    Object.entries(routes).forEach(([routeId, route]) => {
      route.id = routeId.replaceAll('+', '')
      if (route.parentId) {
        route.parentId = route.parentId.replaceAll('+', '')
      }
      newRoutes[route.id] = route
    })
    return newRoutes
  },

NOTE: If you use any route IDs in your app, you must update them to remove the +.

[alexhoo]

Thank you @kiliman for your quick answer! It worked just fine!

[kiliman]

Awesome!