attempt serving static html instead of template

LoTerence · Dec 7, 2024 · b53fafc · b53fafc
1 parent 3c3a5ce
commit b53fafc
Show file tree

Hide file tree

Showing 5 changed files with 71 additions and 32 deletions.
diff --git a/.gitignore b/.gitignore
@@ -25,5 +25,6 @@ dev/linter.env
 
 # static build files
 backend/frontend/static/vite_assets_dist
+backend/frontend/static/frontend
 backend/staticfiles
 backend/openapi-schema.yml
diff --git a/backend/backend/settings.py b/backend/backend/settings.py
@@ -40,7 +40,7 @@
     "django.contrib.staticfiles",
     "ctj_api.apps.CtjApiConfig",
     "rest_framework",
-    "django_vite",
+    # "django_vite",
 ]
 
 MIDDLEWARE = [
@@ -90,12 +90,12 @@
 
 # Whitenoise settings
 # http://whitenoise.evans.io/en/stable/django.html#WHITENOISE_IMMUTABLE_FILE_TEST
-def immutable_file_test(path, url):
-    # Match vite (rollup)-generated hashes, à la, `some_file-CSliV9zW.js`
-    return re.match(r"^.+[.-][0-9a-zA-Z_-]{8,12}\..+$", url)
+# def immutable_file_test(path, url):
+#     # Match vite (rollup)-generated hashes, à la, `some_file-CSliV9zW.js`
+#     return re.match(r"^.+[.-][0-9a-zA-Z_-]{8,12}\..+$", url)
 
 
-WHITENOISE_IMMUTABLE_FILE_TEST = immutable_file_test
+# WHITENOISE_IMMUTABLE_FILE_TEST = immutable_file_test
 
 STORAGES = {
     "staticfiles": {
@@ -166,23 +166,25 @@ def immutable_file_test(path, url):
 
 # django-vite settings
 # https://github.com/MrBin99/django-vite
-DJANGO_VITE = {
-    "default": {
-        # enable vite HMR in dev mode
-        "dev_mode": config("DEBUG", default=False, cast=bool),
-        "dev_server_port": 5175,
-        # resolve static asset paths in production
-        "manifest_path": Path(
-            BASE_DIR
-            / "frontend"
-            / "static"
-            / "vite_assets_dist"
-            / ".vite"
-            / "manifest.json"
-        ).resolve(),
-    }
-}
+# DJANGO_VITE = {
+#     "default": {
+#         # enable vite HMR in dev mode
+#         "dev_mode": config("DEBUG", default=False, cast=bool),
+#         "dev_server_port": 5175,
+#         # resolve static asset paths in production
+#         "manifest_path": Path(
+#             BASE_DIR
+#             / "frontend"
+#             / "static"
+#             / "vite_assets_dist"
+#             / ".vite"
+#             / "manifest.json"
+#         ).resolve(),
+#     }
+# }
 # Add the build.outDir from vite.config.js to STATICFILES_DIRS
 # so that collectstatic can collect your compiled vite assets.
-STATICFILES_DIRS = [BASE_DIR / "frontend/static/vite_assets_dist"]
+# STATICFILES_DIRS = [BASE_DIR / "frontend/static/vite_assets_dist"]
 # Note: When building, these files need to be copied over from /frontend/dist
+
+STATICFILES_DIRS = [BASE_DIR / "frontend/static/frontend"]
diff --git a/backend/backend/urls.py b/backend/backend/urls.py
@@ -20,6 +20,9 @@
 from django.urls import include, path, re_path
 from django.views.generic import TemplateView
 
+from django.conf import settings
+from django.views.static import serve
+
 
 # Custom handler for incorrect API routes
 def api_not_found(request, exception=None):
@@ -39,9 +42,17 @@ def api_not_found(request, exception=None):
     # Custom error handler for invalid API routes
     re_path(r"^api/.*$", api_not_found),  # Catch-all for incorrect API routes
     # Catch-all for frontend (React)
+    # re_path(
+    #     r"^.*$",
+    #     TemplateView.as_view(template_name="index.html"),
+    #     name="index",
+    # ),
     re_path(
         r"^.*$",
-        TemplateView.as_view(template_name="index.html"),
-        name="index",
+        serve,
+        {
+            "path": "index.html",
+            "document_root": settings.BASE_DIR / "frontend/static/frontend",
+        },
     ),
 ]
diff --git a/frontend/index.html b/frontend/index.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="utf-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
+    <title>Civic Tech Jobs</title>
+
+    <!-- TODO: fix favicon-->
+    <!-- Loads favicon via template -->
+    <link rel="icon" href="./src/assets/images/svgs/logos/logo-logomark.svg" />
+</head>
+
+<body>
+    <noscript> You need to enable JavaScript to run this app. </noscript>
+    <div id="app"></div>
+    <script type="module" src="/src/index.tsx"></script>
+</body>
+
+</html>
diff --git a/frontend/vite.config.mts b/frontend/vite.config.mts
@@ -2,22 +2,26 @@ import { defineConfig } from "vite";
 import react from "@vitejs/plugin-react";
 import tsconfigPaths from "vite-tsconfig-paths";
 import svgr from "vite-plugin-svgr";
-import { resolve, join } from "path";
+import {
+  resolve,
+  // join
+} from "path";
 
 export default defineConfig(() => {
-  const INPUT_DIR = "./src";
-  const OUTPUT_DIR = "./dist";
+  // const INPUT_DIR = "./src";
+  // const OUTPUT_DIR = "./dist";
 
   return {
     //to resolve relative file paths for sass (no plugin)
     resolve: {
       alias: {
-        "@": resolve(INPUT_DIR),
+        // "@": resolve(INPUT_DIR),
+        "@": resolve("./src"),
       },
     },
-    root: resolve(INPUT_DIR),
+    // root: resolve(INPUT_DIR),
     //keep static assets path consistent with django
-    base: "/static/",
+    // base: "/static/",
     plugins: [
       svgr(),
       react(),
@@ -32,7 +36,7 @@ export default defineConfig(() => {
         usePolling: true,
       },
     },
-    build: {
+    /* build: {
       manifest: true,
       emptyOutDir: true,
       outDir: resolve(OUTPUT_DIR),
@@ -41,6 +45,6 @@ export default defineConfig(() => {
           entry: join(INPUT_DIR, "/index.tsx"),
         },
       },
-    },
+    }, */
   };
 });