masterApp/routes/layout.tsx

import { useModuleApps } from '@modern-js/plugin-garfish/runtime';
import { Outlet } from '@modern-js/runtime/router';

export default function Layout() {
  const { Header, Footer } = useModuleApps();
  console.log('Layout render');
  return (
    <div>
      <div id="header-container"><Header /></div>
      {/* <div id="header-container">header {Math.random()}</div> */}
      <Outlet />
      {/* <div id="footer-container">footer {Math.random()}</div> */}
      <div id="footer-container"><Footer /></div>
    </div>
  );
}