From ab8a80f34c2ad1ee1bfd85c8daa75f65f0135bd5 Mon Sep 17 00:00:00 2001 From: ISA Date: Fri, 25 Oct 2024 11:21:56 +0200 Subject: [PATCH] =?UTF-8?q?feat:=20dynamische=20URL-Anpassung=20f=C3=BCr?= =?UTF-8?q?=20Entwicklungs-=20und=20Produktionsumgebung?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Navigation und Weiterleitungen angepasst, um dynamisch `.html`-Endungen in Produktionsumgebung anzuhängen. - Nutzung von `NEXT_PUBLIC_NODE_ENV` ermöglicht unterschiedliche URL-Strukturen in Entwicklungs- und Produktionsumgebung. - `Navigation`-Komponente und `index.js` entsprechend konfiguriert, um `.html` in der Produktionsumgebung automatisch anzuhängen. - Verbesserte Konsistenz und Funktionalität zwischen beiden Umgebungen, 404-Fehler in Produktion behoben. --- app/json/page.jsx | 20 --------- app/layout.js | 31 -------------- app/page.js | 38 ------------------ components/Navigation.jsx | 12 +++--- next.config.mjs | 8 ++-- package-lock.json | 16 ++++++++ package.json | 6 ++- pages/_app.js | 34 ++++++++++++++++ pages/_document.js | 16 ++++++++ app/access/page.jsx => pages/access.js | 0 .../page.jsx => pages/analogeEingaenge.js | 0 app/dashboard/page.jsx => pages/dashboard.js | 14 +++---- .../page.jsx => pages/einausgaenge.js | 0 {app => pages}/favicon.ico | Bin {app => pages}/fonts/GeistMonoVF.woff | Bin {app => pages}/fonts/GeistVF.woff | Bin pages/index.js | 17 ++++++++ .../page.jsx => pages/kabelueberwachung.js | 4 +- app/meldungen/page.jsx => pages/meldungen.js | 0 app/wait/page.jsx => pages/wait.js | 2 +- {app => styles}/globals.css | 0 21 files changed, 108 insertions(+), 110 deletions(-) delete mode 100644 app/json/page.jsx delete mode 100644 app/layout.js delete mode 100644 app/page.js create mode 100644 pages/_app.js create mode 100644 pages/_document.js rename app/access/page.jsx => pages/access.js (100%) rename app/analogeEingaenge/page.jsx => pages/analogeEingaenge.js (100%) rename app/dashboard/page.jsx => pages/dashboard.js (96%) rename app/einausgaenge/page.jsx => pages/einausgaenge.js (100%) rename {app => pages}/favicon.ico (100%) rename {app => pages}/fonts/GeistMonoVF.woff (100%) rename {app => pages}/fonts/GeistVF.woff (100%) create mode 100644 pages/index.js rename app/kabelueberwachung/page.jsx => pages/kabelueberwachung.js (97%) rename app/meldungen/page.jsx => pages/meldungen.js (100%) rename app/wait/page.jsx => pages/wait.js (95%) rename {app => styles}/globals.css (100%) diff --git a/app/json/page.jsx b/app/json/page.jsx deleted file mode 100644 index ffc0dca..0000000 --- a/app/json/page.jsx +++ /dev/null @@ -1,20 +0,0 @@ -"use client"; // Wichtiger Hinweis, wenn du Next.js App Router verwendest - -import { useEffect } from "react"; - -export default function Json() { - // Beispielvariable - const myVariable = "<%=KIZ0%>"; - - // useEffect, um sicherzustellen, dass die Konsole nach dem Laden der Seite ausgeführt wird - useEffect(() => { - console.log("Die Variable ist: ", myVariable); - }, []); // Der leere Array sorgt dafür, dass es nur einmal beim Laden der Komponente ausgeführt wird - - return ( -
-

Json Page

-

Überprüfe die Konsole, um die Variable zu sehen.

-
- ); -} diff --git a/app/layout.js b/app/layout.js deleted file mode 100644 index 7dc3f8f..0000000 --- a/app/layout.js +++ /dev/null @@ -1,31 +0,0 @@ -"use client"; // Nur in Client-Komponenten verwenden, nicht in Layout-Dateien -import React from "react"; -import Header from "../components/Header"; -import Navigation from "../components/Navigation"; -import Footer from "../components/Footer"; -import "../app/globals.css"; - -// Diese Datei befindet sich in /app/layout.js -export default function RootLayout({ children }) { - return ( - - - {/* Hier können Meta-Tags oder Links für CSS hinzugefügt werden */} - - - Littwin Systemtechnik GmbH & Co. KG - - - {/* Hier das Layout mit Header, Navigation und Footer */} -
-
-
- -
{children}
-
-
-
- - - ); -} diff --git a/app/page.js b/app/page.js deleted file mode 100644 index e21b63a..0000000 --- a/app/page.js +++ /dev/null @@ -1,38 +0,0 @@ -"use client"; -import { useEffect } from "react"; -import { useRouter } from "next/navigation"; // App-Router Hook für Navigation - -// Importiere `storePage` nur im Client -export default function Home() { - const router = useRouter(); - - useEffect(() => { - // Überprüfe, ob der Code im Browser läuft - if (typeof window !== "undefined") { - // Dynamischer Import von `storePage` nur im Browser - import("../utils/indexedDB").then(({ storePage }) => { - const pageContent = ` -
-

Bitte warten...

- -

Die Seite wird automatisch neu geladen.

-
`; - storePage("waitPage", new Blob([pageContent], { type: "text/html" })) - .then(() => { - console.log("Seite 'wait' erfolgreich gespeichert."); - // Weiterleitung zur Dashboard-Seite - router.push("/dashboard"); - }) - .catch((error) => { - console.error("Fehler beim Speichern der Seite 'wait':", error); - router.push("/dashboard"); - }); - }); - } else { - // Falls kein Browser oder IndexedDB verfügbar ist, direkt zur Dashboard-Seite weiterleiten - router.push("/dashboard"); - } - }, [router]); - - return
Wird geladen...
; // Temporärer Ladezustand -} diff --git a/components/Navigation.jsx b/components/Navigation.jsx index 0995fb1..4255153 100644 --- a/components/Navigation.jsx +++ b/components/Navigation.jsx @@ -13,20 +13,22 @@ function Navigation() { } }, [pathname]); + // Dynamische Anpassung der Pfade mit oder ohne .html + const isProduction = process.env.NEXT_PUBLIC_NODE_ENV === "production"; const menuItems = [ { name: "Übersicht", path: "/dashboard" }, { name: "Kabelüberwachung", path: "/kabelueberwachung" }, - //{ name: "Zutrittskontrolle", path: "/access" }, - //{ name: "Ein- und Ausgänge", path: "/einausgaenge" }, - //{ name: "Analoge Eingänge", path: "/analogeEingaenge" }, - //{ name: "Meldungen", path: "/meldungen" }, + // Weitere Menüpunkte hier ]; return (