How to view the generated react-router routes from Remix app? ( Remix CLI command to view routes)

[cliffordfajardo]

I'm debugging a routing issue in my Remix app. I was wondering if there was a way to view the react-router routes that get generated from the app/routes folder.

The idea of the command was that it would output something that looks like (using info from your /routes folder this when you run the command:

$ some_remix_command
<Routes>
  <Route file="root.tsx">
    <Route path="blog" index file="routes/blog/index.tsx" />
    <Route index file="routes/index.tsx" />
  </Route>
</Routes>

[cliffordfajardo]

Credits to @sergiodxa & remix community:
The answer is to use the following command inside the root of your remix apps folder:

npx remix routes

Or you can run the following command to get a JSON representation of your apps /routes folder

remix routes --json

[kiliman]

Can you run tree app/routes and show me the file listing. The .server suffix is typically used for non-route modules. Are you saying that you want server in the actual URL? If so, you should update your route filename to .[server].

[sergiodxa]

There are not server-side only routes, every route is a server-side route first, if you don't add an export default to a route it will be a resource route which is server-side only, the .server suffix is not needed in route files.

[KrishnaPG]

Thank you @kiliman Say, I have api+/echo.server.js which has only POST action in it.

Now, this route /api/echo would not be visible in the remix routes listing (since it has server in the file name). But that is a valid server-side route that a front-end can make a call to with POST action.

For some reason, after upgrading few packages, I am getting 404 not found error when the front-end is making a call to that route, which used to work fine earlier. Hence I wanted to debug where the problem is, and I could not figure out a way to list all the routes available in the app (both front-end + backend routes).

[kiliman]

As @sergiodxa said, you don't need to add the .server suffix. Just name it echo.js.

[sergiodxa]

And the reason it's failing is most likely because now Remix is giving it the URL /echo/server.