The issue might be the re-export stuff, so fix that!

frontend/admin/app/root.tsx

@@ -1,4 +1,5 @@
-import { links, ErrorBoundary, App, handle, loader } from './khaleesi/home/document'
+import { links, ErrorBoundary, App, handle } from './khaleesi/home/document'
+import { loader } from './khaleesi/home/document.server'
 
 
 const AdminApp: () => JSX.Element = () => <App title="Admin Console" />

frontend/khaleesi/app/khaleesi/auth/loginRoute.tsx

@@ -1,5 +1,56 @@
-import { meta, handle, action, LoginRoute } from './login'
+import type { MetaFunction, ActionFunctionArgs } from '@remix-run/node'
+import { data } from '@remix-run/node'
+import { Form } from '@remix-run/react'
+import { useContext } from 'react'
+import { AppContext } from '../home/document'
+import { breadcrumb } from '../navigation/breadcrumb'
+import { loginNavigationData } from '../navigation/commonNavigationData'
+import { Session } from './session.server'
 
 
-export default LoginRoute
-export { meta, handle, action }
+export const handle = {
+  ...breadcrumb(loginNavigationData),
+}
+
+
+export const meta: MetaFunction = () => {
+  const appContext = useContext(AppContext)  // eslint-disable-line react-hooks/rules-of-hooks
+
+  return [
+    { title: `Login | ${appContext.title}` },
+    { name: 'description', content: 'Identify yourself!' },
+  ]
+}
+
+export async function action({ request }: ActionFunctionArgs) {
+  const session = new Session()
+  await session.init(request)
+  const form = await request.formData()
+  const user = form.get('user')
+
+  if ('string' !== typeof user) {
+    return data({ fieldErrors: { user: 'wrong type' }, formError: null }, { status: 400 })
+  }
+
+  return session.create(user, '/')
+}
+
+
+export default function LoginRoute(): JSX.Element {
+  return (
+    <div>
+      <h1>Login</h1>
+      <section><Form method="post">
+        <label>
+          <input type="radio" name="user" value="user" defaultChecked />
+          user
+        </label>
+        <label>
+          <input type="radio" name="user" value="admin" />
+          admin
+        </label>
+        <button type="submit" className="button" name="action">Login</button>
+      </Form></section>
+    </div>
+  )
+}

frontend/khaleesi/app/khaleesi/auth/logoutRoute.tsx

@@ -1,5 +1,40 @@
-import { meta, handle, action, LogoutRoute } from './logout'
+import type { MetaFunction, ActionFunctionArgs } from '@remix-run/node'
+import { Form } from '@remix-run/react'
+import { useContext } from 'react'
+import { AppContext } from '../home/document'
+import { breadcrumb } from '../navigation/breadcrumb'
+import { logoutNavigationData } from '../navigation/commonNavigationData'
+import { Session } from './session.server'
 
 
-export default LogoutRoute
-export { meta, handle, action }
+export const handle = {
+  ...breadcrumb(logoutNavigationData),
+}
+
+
+export const meta: MetaFunction = () => {
+  const appContext = useContext(AppContext)  // eslint-disable-line react-hooks/rules-of-hooks
+
+  return [
+    { title: `Logout | ${appContext.title}` },
+    { name: 'description', content: 'Logout.' },
+  ]
+}
+
+export async function action({ request }: ActionFunctionArgs) {
+  const session = new Session()
+  await session.init(request)
+  return session.destroy('/')
+}
+
+
+export default function LogoutRoute(): JSX.Element {
+  return (
+    <div>
+      <h1>Logout</h1>
+      <section><Form method="post">
+        <button type="submit" className="button" name="action">Logout</button>
+      </Form></section>
+    </div>
+  )
+}

frontend/khaleesi/app/khaleesi/home/document.server.tsx

@@ -0,0 +1,17 @@
+import type { LoaderFunctionArgs } from '@remix-run/node'
+import { navigationData } from '../../navigationData'
+import {
+  topNavigationData,
+  bottomNavigationData,
+} from '../navigation/commonNavigationData'
+import { Session } from '../auth/session.server'
+
+export async function loader({ request }: LoaderFunctionArgs) {
+  const session = new Session()
+  await session.init(request)
+  return {
+    top    : topNavigationData.filter((data) => session.hasPermission(data.permission)),
+    middle : navigationData.filter((data) => session.hasPermission(data.permission)),
+    bottom : bottomNavigationData.filter((data) => session.hasPermission(data.permission)),
+  }
+}

frontend/khaleesi/app/khaleesi/home/document.tsx

@@ -29,32 +29,19 @@ export const handle = {
   ...breadcrumb(homeNavigationData),
 }
 
-
 export type AppContextType = {
   title     : string,
 }
 export const AppContext: Context<AppContextType> = createContext({
   title     : 'Change your title!',
 })
 
-
 type LoaderType = {
   top    : NavigationElementProperties[],
   middle : NavigationElementProperties[],
   bottom : NavigationElementProperties[],
 }
 
-export async function loader({ request }: LoaderFunctionArgs) {
-  const { Session } = await import('../auth/session.server')
-  const session = new Session()
-  await session.init(request)
-  return {
-    top    : topNavigationData.filter((data) => session.hasPermission(data.permission)),
-    middle : navigationData.filter((data) => session.hasPermission(data.permission)),
-    bottom : bottomNavigationData.filter((data) => session.hasPermission(data.permission)),
-  }
-}
-
 function Document({
   children,
   title,

frontend/khaleesi_frontend_tests/app/root.tsx

@@ -1,4 +1,5 @@
-import { links, ErrorBoundary, App, handle, loader } from './khaleesi/home/document'
+import { links, ErrorBoundary, App, handle } from './khaleesi/home/document'
+import { loader } from './khaleesi/home/document.server'
 
 
 const TestApp: () => JSX.Element = () => <App title="Test App" />

frontend/khaleesi_frontend_tests/tests/testAuth/testLogin.tsx → frontend/khaleesi_frontend_tests/tests/testAuth/testLoginRoute.tsx

@@ -1,7 +1,7 @@
 import '@testing-library/jest-dom'
 import type { ActionFunctionArgs } from '@remix-run/node'
 import { render, screen } from '@testing-library/react'
-import { LoginRoute, action } from '../../app/khaleesi/auth/login'
+import LoginRoute, { action } from '../../app/khaleesi/auth/loginRoute'
 import { suppressReactRouterFutureWarnings } from '../../app/khaleesi/testUtil/consoleLogging'
 import { createTestingStub } from '../../app/khaleesi/testUtil/remixStub'
 

frontend/khaleesi_frontend_tests/tests/testAuth/testLogout.tsx → frontend/khaleesi_frontend_tests/tests/testAuth/testLogoutRoute.tsx

@@ -1,7 +1,7 @@
 import '@testing-library/jest-dom'
 import type { ActionFunctionArgs } from '@remix-run/node'
 import { render, screen } from '@testing-library/react'
-import { LogoutRoute, action } from '../../app/khaleesi/auth/logout'
+import LogoutRoute, { action } from '../../app/khaleesi/auth/logoutRoute'
 import { suppressReactRouterFutureWarnings } from '../../app/khaleesi/testUtil/consoleLogging'
 import { createTestingStub } from '../../app/khaleesi/testUtil/remixStub'
 

frontend/vite.config.mjs

@@ -0,0 +1,24 @@
+// noinspection JSUnresolvedReference
+import { vitePlugin as remix } from '@remix-run/dev';
+import { defineConfig } from 'vite';
+export default defineConfig({
+    server: {
+        host: '0.0.0.0',
+        port: 8000,
+    },
+    plugins: [remix({
+            ignoredRouteFiles: ['**/.*'],
+            // appDirectory: 'app',
+            // assetsBuildDirectory: 'public/build',
+            // serverBuildPath: 'build/index.js',
+            // publicPath: 'build/',
+            future: {
+                v3_fetcherPersist: true,
+                v3_relativeSplatPath: true,
+                v3_throwAbortReason: true,
+                v3_lazyRouteDiscovery: true,
+                v3_singleFetch: true,
+                v3_routeConfig: true,
+            },
+        })],
+});

templates/frontend/frontend_template/app/root.tsx

@@ -1,4 +1,5 @@
-import { links, ErrorBoundary, App, handle, loader } from './khaleesi/home/document'
+import { links, ErrorBoundary, App, handle } from './khaleesi/home/document'
+import { loader } from './khaleesi/home/document.server'
 
 
 const NewApp: () => JSX.Element = () => <App title="Lorem Ipsum" />