'Can't get my environment variables to the CatchBoundry in my root file

Hello I can't get my environment variable(s) to my CatchBoundry using the loader function method in my root file Am I missing something as I saw this Remix.run environment variables in Catch/Error Boundary But did not work for me

root.tsx:

export async function loader() {
   throw new Response(
      JSON.stringify({
        message: "Not Foundxxx",
        ENV: {
           NODE_REST_API_HOSTNAME: NODE_REST_API_HOSTNAME,
        }
      }),
      {
        status: 404,
      });
}

export function CatchBoundary() {
 const caught = useCatch();
 console.log('no data from loader function above??', caught);

 return <DefaultCatchBoundary caught={caught} />;
}

 export default function App() {
   return (
    <html lang="en">
  <head>
    <Meta />
    <Links />
  </head>
  <body>
    <Outlet />
    <ScrollRestoration />
    <Scripts 

    />
    {process.env.NODE_ENV === 'development' ? <LiveReload /> : null}
  </body>
</html>
);
}


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source