Frontend build without dev dependencies (#918)

.github/workflows/build-lint-test.yml

@@ -9,11 +9,6 @@ on:
     branches:
       - main
 
-env:
-  CARGO_TERM_COLOR: always
-  ASSET_DIR: ${{ github.workspace }}/frontend/dist
-  SQLX_OFFLINE: "true"
-
 jobs:
   backend:
     name: Backend (${{ matrix.target.os }})
@@ -33,6 +28,11 @@ jobs:
     defaults:
       run:
         working-directory: ./backend
+    env:
+      CARGO_TERM_COLOR: always
+      ASSET_DIR: ${{ github.workspace }}/frontend/dist
+      SQLX_OFFLINE: "true"
+      NODE_ENV: production
     steps:
       - uses: actions/checkout@v4
       # Build frontend so that it can be included in the backend build

.github/workflows/release.yml

@@ -6,11 +6,6 @@ on:
   schedule:
     - cron: '0 12 * * 0'
 
-env:
-  CARGO_TERM_COLOR: always
-  ASSET_DIR: ${{ github.workspace }}/frontend/dist
-  SQLX_OFFLINE: "true"
-
 jobs:
   build:
     name: Build
@@ -30,6 +25,11 @@ jobs:
     defaults:
       run:
         working-directory: ./backend
+    env:
+      CARGO_TERM_COLOR: always
+      ASSET_DIR: ${{ github.workspace }}/frontend/dist
+      SQLX_OFFLINE: "true"
+      NODE_ENV: production
     steps:
       - uses: actions/checkout@v4
       - name: Setup Node

frontend/app/main.tsx

@@ -4,8 +4,6 @@ import { createBrowserRouter, RouterProvider } from "react-router";
 
 import { ApiProvider } from "@kiesraad/api";
 
-// ignore in prod
-import { startMockAPI } from "./msw-mock-api";
 import { routes } from "./routes";
 
 const rootDiv = document.getElementById("root");
@@ -29,8 +27,17 @@ function render() {
 }
 
 if (__API_MSW__) {
-  startMockAPI()
-    .then(render)
+  // import msw-mock-api here instead of at the top of the file,
+  // so that we only use MSW in development and don't need it in production
+  import("./msw-mock-api")
+    .then((mockAPI) =>
+      mockAPI
+        .startMockAPI()
+        .then(render)
+        .catch((e: unknown) => {
+          console.error(e);
+        }),
+    )
     .catch((e: unknown) => {
       console.error(e);
     });