remix nested routes in folder can't be find

Question

EveryBody I use the remix to build a simple page which want to use folders to orgnize the routes. This is my project directory

- app/
  - root.tsx
  - examples/
    - route.tsx
    - child1/
      - account.tsx

In examples directory, it has a route.tsx, content is

import { Outlet } from "@remix-run/react";

export default function Examples() {
  return (
    <div>
      <h1>ExampleRoute</h1>
      <Outlet />
    </div>
  );
}

And the child1 export the react ui components named Account

export default function Account() {
  return (
    <>
      <h1>Accout</h1>
    </>
  );
}

But When I open /examples/child1, the server return 404. What mistakes did I make ?

I read the remix doc about the nested folders, but there is only one level nests. And I ask the gpt, it tell me the exampels should have route.tsx, so the remix can recognize it as route

Answer 1

Only the folders directly beneath app/routes will be registered as a route. Deeply nested folders are ignored. The file at app/routes/about/header/route.tsx will not create a route.1