In the material for this exercise, we are asked to add a default export to the routes/$.tsx page:
Finally, you'll want to 🐨 export a default export so Remix treats this route as a regular page (otherwise it'll be treated as a Resource Route):
// ...
export default function NotFound() {
// due to the loader, this component will never be rendered, but we'll return
// the error boundary just in case.
return
}
// ...
However, if the default `NotFound` export is omitted, the route seems to be treated as a page. In other words, it is sufficient to only export the `ErrorBoundary` component (as a named export) in order for a route to become a page. For example, this works the same way as the proposed solution in the material:
<details>
<summary>routes/$.tsx</summary>
```tsx
import { Link, useLocation } from '@remix-run/react'
import { GeneralErrorBoundary } from '../components/error-boundary.tsx'
export async function loader() {
throw new Response('Not found', { status: 404 })
}
export function ErrorBoundary() {
const location = useLocation()
return (
<GeneralErrorBoundary
statusHandlers={{
404: () => (
<div className="flex flex-col gap-6">
<div className="flex flex-col gap-3">
<h1>We can't find this page:</h1>
<pre className="text-body-lg whitespace-pre-wrap break-all">
{location.pathname}
</pre>
</div>
<Link to="/" className="text-body-md underline">
Back to home
</Link>
</div>
),
}}
/>
)
}
I'm not sure if this is intentional behavior of Remix. Maybe it's worth reaching out to the Remix team directly to inquire about it. But it appears that the solution could be simplified, and I'm curious to know your thoughts on this. Thank you!
In the material for this exercise, we are asked to add a default export to the
routes/$.tsx
page:export default function NotFound() { // due to the loader, this component will never be rendered, but we'll return // the error boundary just in case. return
}
// ...
I'm not sure if this is intentional behavior of Remix. Maybe it's worth reaching out to the Remix team directly to inquire about it. But it appears that the solution could be simplified, and I'm curious to know your thoughts on this. Thank you!