chore: make dev overrides work in monorepo

packages/open-next/src/overrides/incrementalCache/fs-dev.ts

@@ -1,10 +1,11 @@
-import type { IncrementalCache } from "types/overrides.js";
-
 import fs from "node:fs/promises";
 import path from "node:path";
 
+import type { IncrementalCache } from "types/overrides.js";
+import { getMonorepoRelativePath } from "utils/normalize-path";
+
 const buildId = process.env.NEXT_BUILD_ID;
-const basePath = path.resolve(process.cwd(), `../../cache/${buildId}`);
+const basePath = path.join(getMonorepoRelativePath(), `cache/${buildId}`);
 
 const getCacheKey = (key: string) => {
   return path.join(basePath, `${key}.cache`);

packages/open-next/src/overrides/tagCache/fs-dev.ts

@@ -1,10 +1,13 @@
-import type { TagCache } from "types/overrides";
-
 import fs from "node:fs";
+import path from "node:path";
 
-// TODO: fix this for monorepo
-const tagFile = "../../dynamodb-provider/dynamodb-cache.json";
+import type { TagCache } from "types/overrides";
+import { getMonorepoRelativePath } from "utils/normalize-path";
 
+const tagFile = path.join(
+  getMonorepoRelativePath(),
+  "dynamodb-provider/dynamodb-cache.json",
+);
 const tagContent = fs.readFileSync(tagFile, "utf-8");
 
 let tags = JSON.parse(tagContent) as {

packages/open-next/src/overrides/wrappers/express-dev.ts

@@ -1,14 +1,20 @@
+import path from "node:path";
 import express from "express";
 
 import type { StreamCreator } from "types/open-next.js";
 import type { WrapperHandler } from "types/overrides.js";
+import { getMonorepoRelativePath } from "utils/normalize-path";
 
 const wrapper: WrapperHandler = async (handler, converter) => {
   const app = express();
   // To serve static assets
-  app.use(express.static("../../assets"));
+  app.use(express.static(path.join(getMonorepoRelativePath(), "assets")));
+
+  const imageHandlerPath = path.join(
+    getMonorepoRelativePath(),
+    "image-optimization-function/index.mjs",
+  );
 
-  const imageHandlerPath = "../../image-optimization-function/index.mjs";
   const imageHandler = await import(imageHandlerPath).then((m) => m.handler);
 
   app.all("/_next/image", async (req, res) => {

packages/open-next/src/types/global.ts

@@ -220,4 +220,10 @@ declare global {
   var __next_route_preloader: (
     stage: "waitUntil" | "start" | "warmerEvent" | "onDemand",
   ) => Promise<void>;
+
+  /**
+   * This is the relative package path of the monorepo. It will be an empty string "" in normal repos.
+   * ex. `packages/web`
+   */
+  var monorepoPackagePath: string;
 }

packages/open-next/src/utils/normalize-path.ts

@@ -1,3 +1,16 @@
+import path from "node:path";
+
 export function normalizePath(path: string) {
   return path.replace(/\\/g, "/");
 }
+
+export function getMonorepoRelativePath(relativePath = "../.."): string {
+  return path.join(
+    globalThis.monorepoPackagePath
+      .split("/")
+      .filter(Boolean)
+      .map(() => "..")
+      .join("/"),
+    relativePath,
+  );
+}