@vercel/microfrontends 2.1.1 → 2.1.3

package/CHANGELOG.md

@@ -1,10 +1,22 @@
 # @vercel/microfrontends
 
+## 2.1.3
+
+### Patch Changes
+
+- 93506f2: Fix Next.js image optimization locally for any image path
+
+## 2.1.2
+
+### Patch Changes
+
+- 0606811: Fix local Next.js Image Optimization
+
 ## 2.1.1
 
 ### Patch Changes
 
-- 96f0ea5:  
+- 96f0ea5:
   - Add support for locally overriding to MFE aliases: https://vercel.com/changelog/preview-links-between-microfrontends-projects-now-serve-all-paths
   - Fix local Next.js image optimization. Next.js released a security fix which removes headers from being passed on image optimization requests. The microfrontends local proxy previously relied on the headers being passed.
 

package/dist/bin/cli.cjs

@@ -30,7 +30,7 @@ var import_env = require("@next/env");
 // package.json
 var package_default = {
   name: "@vercel/microfrontends",
-  version: "2.1.1",
+  version: "2.1.3",
   private: false,
   description: "Defines configuration and utilities for microfrontends development",
   keywords: [

package/dist/next/config.cjs

@@ -1700,17 +1700,18 @@ function transform4(args) {
   if (requireLocalProxyHeader) {
     const proxyRedirects = [
       {
-        source: "/:path*",
+        source: `/:path*`,
         destination: `http://localhost:${microfrontend.getLocalProxyPort()}/:path*`,
         permanent: false,
         missing: [
-          { type: "header", key: "x-vercel-mfe-local-proxy-origin" },
-          {
-            type: "host",
-            value: `localhost:${microfrontend.getLocalProxyPort()}`
-            // if it's already on the host, we don't need to redirect
-          }
-        ]
+          { type: "header", key: "x-vercel-mfe-local-proxy-origin" }
+        ],
+        // this fixes relative path Next.js images locally. A security fix removed the headers from the image request,
+        // https://github.com/vercel/next.js/pull/82114, and locally the image fetch does not follow redirects. This
+        // means the header x-vercel-mfe-local-proxy-origin is stripped, and the redirect to then add the header back
+        // in is not followed. As all headers are stripped, there is also no host header, so this check will ensure
+        // relative path Next.js images are not redirected to the local proxy.
+        has: [{ type: "header", key: "host" }]
       }
     ];
     if (next.redirects && typeof next.redirects === "function") {