sst 2.40.4 → 2.40.5

package/constructs/NextjsSite.d.ts

@@ -235,6 +235,7 @@ export declare class NextjsSite extends SsrSite {
         } | undefined;
         buildId?: string | undefined;
     };
+    private prefixPattern;
     private createRevalidationQueue;
     private createRevalidationTable;
     getConstructMetadata(): {
@@ -266,6 +267,7 @@ export declare class NextjsSite extends SsrSite {
     private usePagesManifest;
     private usePrerenderManifest;
     private useServerFunctionPerRouteLoggingInjection;
+    private useCloudFrontFunctionPrerenderBypassHeaderInjection;
     private getBuildId;
     private getSourcemapForAppRoute;
     private getSourcemapForPagesRoute;

package/constructs/NextjsSite.js

@@ -20,13 +20,14 @@ import { useFunctions } from "./Function.js";
 import { useDeferredTasks } from "./deferred_task.js";
 import { Logger } from "../logger.js";
 const LAYER_VERSION = "2";
-const DEFAULT_OPEN_NEXT_VERSION = "2.3.1";
+const DEFAULT_OPEN_NEXT_VERSION = "2.3.5";
 const DEFAULT_CACHE_POLICY_ALLOWED_HEADERS = [
     "accept",
     "rsc",
     "next-router-prefetch",
     "next-router-state-tree",
     "next-url",
+    "x-prerender-bypass",
 ];
 /**
  * The `NextjsSite` construct is a higher level CDK construct that makes it easy to create a Next.js app.
@@ -117,7 +118,10 @@ export class NextjsSite extends SsrSite {
             cloudFrontFunctions: {
                 serverCfFunction: {
                     constructId: "CloudFrontFunction",
-                    injections: [this.useCloudFrontFunctionHostHeaderInjection()],
+                    injections: [
+                        this.useCloudFrontFunctionHostHeaderInjection(),
+                        this.useCloudFrontFunctionPrerenderBypassHeaderInjection(),
+                    ],
                 },
             },
             edgeFunctions: edge
@@ -187,14 +191,14 @@ export class NextjsSite extends SsrSite {
                         },
                         {
                             cacheType: "server",
-                            pattern: "api/*",
+                            pattern: this.prefixPattern("api/*"),
                             cfFunction: "serverCfFunction",
                             edgeFunction: "edgeServer",
                             origin: "s3",
                         },
                         {
                             cacheType: "server",
-                            pattern: "_next/data/*",
+                            pattern: this.prefixPattern("_next/data/*"),
                             cfFunction: "serverCfFunction",
                             edgeFunction: "edgeServer",
                             origin: "s3",
@@ -208,31 +212,31 @@ export class NextjsSite extends SsrSite {
                         },
                         {
                             cacheType: "server",
-                            pattern: "api/*",
+                            pattern: this.prefixPattern("api/*"),
                             cfFunction: "serverCfFunction",
                             origin: "regionalServer",
                         },
                         {
                             cacheType: "server",
-                            pattern: "_next/data/*",
+                            pattern: this.prefixPattern("_next/data/*"),
                             cfFunction: "serverCfFunction",
                             origin: "regionalServer",
                         },
                     ]),
                 {
                     cacheType: "server",
-                    pattern: "_next/image*",
+                    pattern: this.prefixPattern("_next/image*"),
                     cfFunction: "serverCfFunction",
                     origin: "imageOptimizer",
                 },
                 // create 1 behaviour for each top level asset file/folder
                 ...fs.readdirSync(path.join(sitePath, ".open-next/assets")).map((item) => ({
                     cacheType: "static",
-                    pattern: fs
+                    pattern: this.prefixPattern(fs
                         .statSync(path.join(sitePath, ".open-next/assets", item))
                         .isDirectory()
                         ? `${item}/*`
-                        : item,
+                        : item),
                     origin: "s3",
                 })),
             ],
@@ -242,6 +246,13 @@ export class NextjsSite extends SsrSite {
             buildId: this.getBuildId(),
         });
     }
+    prefixPattern(pattern) {
+        // Prefix CloudFront distribution behavior path patterns with `basePath` if configured
+        const { basePath } = this.useRoutesManifest();
+        return basePath && basePath.length > 0
+            ? `${basePath.slice(1)}/${pattern}`
+            : pattern;
+    }
     createRevalidationQueue() {
         if (!this.serverFunction)
             return;
@@ -520,6 +531,15 @@ if (event.rawPath) {
       },
     }));
   }
+}`;
+    }
+    useCloudFrontFunctionPrerenderBypassHeaderInjection() {
+        // In Next.js page router preview mode (depends on the cookie __prerender_bypass),
+        // to ensure we receive the cached page instead of the preview version, we set the
+        // header "x-prerender-bypass", and add it to cache policy's allowed headers.
+        return `
+if (request.cookies["__prerender_bypass"]) { 
+  request.headers["x-prerender-bypass"] = { value: "true" }; 
 }`;
     }
     getBuildId() {

package/constructs/RemixSite.d.ts

@@ -58,7 +58,7 @@ export declare class RemixSite extends SsrSite {
                     from: string;
                     to: string;
                     cached: true;
-                    versionedSubDir: string;
+                    versionedSubDir: string | undefined;
                 }[];
             };
             regionalServer?: {
@@ -91,7 +91,8 @@ export declare class RemixSite extends SsrSite {
         } | undefined;
         buildId?: string | undefined;
     };
-    protected getServerModuleFormat(): "cjs" | "esm";
+    private hasViteConfig;
+    private getServerModuleFormat;
     private createServerLambdaBundle;
     getConstructMetadata(): {
         data: {

package/constructs/RemixSite.js

@@ -26,8 +26,9 @@ export class RemixSite extends SsrSite {
     }
     plan() {
         const { path: sitePath, edge } = this.props;
-        const { handler, inject } = this.createServerLambdaBundle(edge ? "edge-server.js" : "regional-server.js");
-        const format = this.getServerModuleFormat();
+        const isUsingVite = this.hasViteConfig();
+        const format = this.getServerModuleFormat(isUsingVite);
+        const { handler, inject } = this.createServerLambdaBundle(isUsingVite, edge ? "edge-server.js" : "regional-server.js");
         const serverConfig = {
             description: "Server handler for Remix",
             handler,
@@ -38,6 +39,11 @@ export class RemixSite extends SsrSite {
                 },
             },
         };
+        // The path for all files that need to be in the "/" directory (static assets)
+        // is different when using Vite. These will be located in the "build/client"
+        // path of the output. It will be the "public" folder when using remix config.
+        const assetsPath = isUsingVite ? path.join("build", "client") : "public";
+        const assetsVersionedSubDir = isUsingVite ? undefined : "build";
         return this.validatePlan({
             edge: edge ?? false,
             cloudFrontFunctions: {
@@ -79,10 +85,10 @@ export class RemixSite extends SsrSite {
                     type: "s3",
                     copy: [
                         {
-                            from: "public",
+                            from: assetsPath,
                             to: "",
                             cached: true,
-                            versionedSubDir: "build",
+                            versionedSubDir: assetsVersionedSubDir,
                         },
                     ],
                 },
@@ -101,10 +107,10 @@ export class RemixSite extends SsrSite {
                         origin: "regionalServer",
                     },
                 // create 1 behaviour for each top level asset file/folder
-                ...fs.readdirSync(path.join(sitePath, "public")).map((item) => ({
+                ...fs.readdirSync(path.join(sitePath, assetsPath)).map((item) => ({
                     cacheType: "static",
                     pattern: fs
-                        .statSync(path.join(sitePath, "public", item))
+                        .statSync(path.join(sitePath, assetsPath, item))
                         .isDirectory()
                         ? `${item}/*`
                         : item,
@@ -114,8 +120,17 @@ export class RemixSite extends SsrSite {
             ],
         });
     }
-    getServerModuleFormat() {
+    hasViteConfig() {
         const { path: sitePath } = this.props;
+        return (fs.existsSync(path.resolve(sitePath, "vite.config.ts")) ||
+            fs.existsSync(path.resolve(sitePath, "vite.config.js")));
+    }
+    getServerModuleFormat(isUsingVite) {
+        const { path: sitePath } = this.props;
+        // Remix has two possible config formats: "remix.config.js" or "vite.config.ts/js".
+        // If using the vite format, we can short circuit the logic and just return ESM.
+        if (isUsingVite)
+            return "esm";
         // Validate config path
         const configPath = path.resolve(sitePath, "remix.config.js");
         if (!fs.existsSync(configPath)) {
@@ -158,7 +173,7 @@ export class RemixSite extends SsrSite {
         });
         return format;
     }
-    createServerLambdaBundle(wrapperFile) {
+    createServerLambdaBundle(isUsingVite, wrapperFile) {
         // Create a Lambda@Edge handler for the Remix server bundle.
         //
         // Note: Remix does perform their own internal ESBuild process, but it
@@ -178,13 +193,24 @@ export class RemixSite extends SsrSite {
         // Ensure build directory exists
         const buildPath = path.join(this.props.path, "build");
         fs.mkdirSync(buildPath, { recursive: true });
-        // Copy the server lambda handler
-        fs.copyFileSync(path.resolve(__dirname, `../support/remix-site-function/${wrapperFile}`), path.join(buildPath, "server.js"));
+        // Copy the server lambda handler and pre-append the build injection based
+        // on the config file used.
+        const content = [
+            // When using Vite config, the output build will be "server/index.js"
+            // and when using Remix config it will be `server.js`.
+            `// Import the server build that was produced by 'remix build'`,
+            isUsingVite
+                ? `import * as remixServerBuild from "./server/index.js";`
+                : `import * as remixServerBuild from "./index.js";`,
+            ``,
+            fs.readFileSync(path.resolve(__dirname, `../support/remix-site-function/${wrapperFile}`), { encoding: "utf8" }),
+        ].join("\n");
+        fs.writeFileSync(path.resolve(buildPath, "server.js"), content);
         // Copy the Remix polyfil to the server build directory
         //
         // Note: We need to ensure that the polyfills are injected above other code that
-        // will depend on them. Importing them within the top of the lambda code
-        // doesn't appear to guarantee this, we therefore leverage ESBUild's
+        // will depend on them when not using Vite. Importing them within the top of the
+        // lambda code doesn't appear to guarantee this, we therefore leverage ESBUild's
         // `inject` option to ensure that the polyfills are injected at the top of
         // the bundle.
         const polyfillDest = path.join(buildPath, "polyfill.js");

package/package.json

@@ -1,7 +1,7 @@
 {
   "sideEffects": false,
   "name": "sst",
-  "version": "2.40.4",
+  "version": "2.40.5",
   "bin": {
     "sst": "cli/sst.js"
   },
@@ -118,7 +118,7 @@
     "@types/ws": "^8.5.3",
     "@types/yargs": "^17.0.13",
     "archiver": "^5.3.1",
-    "astro-sst": "2.40.4",
+    "astro-sst": "2.40.5",
     "async": "^3.2.4",
     "tsx": "^3.12.1",
     "typescript": "^5.2.2",

package/support/remix-site-function/edge-server.js

@@ -1,20 +1,12 @@
 // This is a custom Lambda@Edge handler which imports the Remix server
 // build and performs the Remix server rendering.
 
-// We have to ensure that our polyfills are imported prior to any other modules
-// which may depend on them;
-import { installGlobals } from "@remix-run/node";
-installGlobals();
-
 import {
   createRequestHandler as createNodeRequestHandler,
   readableStreamToString,
 } from "@remix-run/node";
 import { URL } from "url";
 
-// Import the server build that was produced by `remix build`;
-import * as remixServerBuild from "./index.js";
-
 /**
  * Common binary MIME types
  */

package/support/remix-site-function/regional-server.js

@@ -1,19 +1,11 @@
 // This is a custom Lambda URL handler which imports the Remix server
 // build and performs the Remix server rendering.
 
-// We have to ensure that our polyfills are imported prior to any other modules
-// which may depend on them;
-import { installGlobals } from "@remix-run/node";
-installGlobals();
-
 import {
   createRequestHandler as createNodeRequestHandler,
   readableStreamToString,
 } from "@remix-run/node";
 
-// Import the server build that was produced by `remix build`;
-import * as remixServerBuild from "./index.js";
-
 /**
  * Common binary MIME types
  */