Füge Docker- und Babel-Konfigurationen hinzu, aktualisiere Svelte- und Esbuild-Setups, erweitere Typdefinitionen und aktualisiere die README-Datei

esbuild.config.js

@@ -1,3 +1,5 @@
+const fs = require("fs")
+
 const resolvePlugin = {
     name: "resolvePlugin",
     setup(build) {
@@ -15,11 +17,12 @@ const resolvePlugin = {
 
 const sveltePlugin = require("esbuild-svelte")
 
-const distDir = "frontend"
+const frontendDir = "./frontend"
+const distDir = frontendDir + "/dist"
 
-console.log("copy public dir...")
-const copydir = require("copy-dir")
-copydir.sync(__dirname + "/public", __dirname + "/" + distDir)
+// console.log("copy public dir...")
+// const copydir = require("copy-dir")
+// copydir.sync(__dirname + "/public", __dirname + "/" + distDir)
 /*copydir.sync(
     __dirname + "/public/index.html",
     __dirname + "/" + distDir + "/template.html"
@@ -28,22 +31,27 @@ copydir.sync(__dirname + "/public", __dirname + "/" + distDir)
 const svelteConfig = require("./svelte.config")
 const esbuildSvelte = sveltePlugin({
     compilerOptions: {
-        css: false,
+        css: "external",
         hydratable: true,
         dev: (process.argv?.length > 2 ? process.argv[2] : "build") !== "build",
     },
     preprocess: svelteConfig.preprocess,
     cache: true,
+    filterWarnings: (warning) => {
+        // filter out a11y
+        if (warning.code.match(/^a11y/)) return false
+        return true
+    },
 })
 
 const options = {
     logLevel: "info",
     color: true,
-    entryPoints: ["./src/index.ts"],
-    outfile: "./" + distDir + "/_dist_/index.mjs",
-    metafile: true, //"./" + distDir + "/_dist_/meta.json",
+    entryPoints: ["./frontend/src/index.ts"],
+    outfile: distDir + "/index.mjs",
+    metafile: true,
     format: "esm",
-    minify: true,
+    minify: process.argv[2] == "build",
     bundle: true,
     splitting: false,
     plugins: [esbuildSvelte, resolvePlugin],
@@ -53,8 +61,6 @@ const options = {
         ".eot": "file",
         ".svg": "file",
         ".ttf": "file",
-        ".png": "file",
-        ".jpg": "file",
     },
     sourcemap: true,
     target: ["es2020", "chrome61", "firefox60", "safari11", "edge18"],
@@ -64,22 +70,44 @@ const bsMiddleware = []
 
 if (process.argv[2] == "start") {
     const { createProxyMiddleware } = require("http-proxy-middleware")
-    const apiBase = process.env.API_BASE || "http://localhost:8080/api/v1/_/" + process.env.NAMESPACE
+    const dotEnv = fs.readFileSync(__dirname + "/.env", "utf8")
+    const TIBI_NAMESPACE = dotEnv.match(/TIBI_NAMESPACE=(.*)/)[1]
+    const apiBase = process.env.API_BASE || "http://localhost:8080/api/v1/_/" + TIBI_NAMESPACE
     bsMiddleware.push(
-        createProxyMiddleware("/api", {
+        createProxyMiddleware({
+            pathFilter: "/api",
             target: apiBase,
             pathRewrite: { "^/api": "" },
             changeOrigin: true,
+            logLevel: "debug",
         })
     )
+
+    if (process.env.SSR) {
+        bsMiddleware.push(
+            createProxyMiddleware({
+                pathFilter: function (path, req) {
+                    return !path.match(/\./)
+                },
+                target: apiBase,
+                changeOrigin: true,
+                logLevel: "debug",
+                pathRewrite: function (path, req) {
+                    console.log(path)
+                    return "/ssr?url=" + encodeURIComponent(path)
+                },
+            })
+        )
+    }
 }
 
 module.exports = {
     sveltePlugin: sveltePlugin,
     resolvePlugin: resolvePlugin,
     options: options,
+    distDir,
     watch: {
-        path: [__dirname + "/src/**/*"],
+        path: [__dirname + "/" + frontendDir + "/src/**/*"],
     },
     serve: {
         onRequest(args) {
@@ -88,7 +116,7 @@ module.exports = {
     },
     browserSync: {
         server: {
-            baseDir: distDir,
+            baseDir: frontendDir,
             middleware: [
                 require("morgan")("dev"),
                 ...bsMiddleware,