fix: correctly enable edge images (#1631)

* fix: correctly enable edge images

* chore: ensure ef share dir exists

* chore: copy shared ef files before writing next config

* chore: add tests for image ef

* chore: use destr for env var flags

Author: ascorbic

package-lock.json

@@ -15,6 +15,7 @@
     "@netlify/ipx": "^1.2.5",
     "@vercel/node-bridge": "^2.1.0",
     "chalk": "^4.1.2",
+    "destr": "^1.1.1",
     "execa": "^5.1.1",
     "fs-extra": "^10.0.0",
     "globby": "^11.0.4",
@@ -63,4 +64,4 @@
   "engines": {
     "node": ">=12.0.0"
   }
-}
+}

packages/runtime/package.json

@@ -3,9 +3,12 @@ import { promises as fs, existsSync } from 'fs'
 import { resolve, join } from 'path'
 
 import type { NetlifyConfig, NetlifyPluginConstants } from '@netlify/build'
+import { greenBright } from 'chalk'
+import destr from 'destr'
 import { copy, copyFile, emptyDir, ensureDir, readJSON, readJson, writeJSON, writeJson } from 'fs-extra'
 import type { MiddlewareManifest } from 'next/dist/build/webpack/plugins/middleware-plugin'
 import type { RouteHas } from 'next/dist/lib/load-custom-routes'
+import { outdent } from 'outdent'
 
 import { getRequiredServerFiles } from './config'
 
@@ -198,14 +201,13 @@ export const writeEdgeFunctions = async (netlifyConfig: NetlifyConfig) => {
   const edgeFunctionRoot = resolve('.netlify', 'edge-functions')
   await emptyDir(edgeFunctionRoot)
 
-  await copy(getEdgeTemplatePath('../edge-shared'), join(edgeFunctionRoot, 'edge-shared'))
-
   const { publish } = netlifyConfig.build
   const nextConfigFile = await getRequiredServerFiles(publish)
   const nextConfig = nextConfigFile.config
+  await copy(getEdgeTemplatePath('../edge-shared'), join(edgeFunctionRoot, 'edge-shared'))
   await writeJSON(join(edgeFunctionRoot, 'edge-shared', 'nextConfig.json'), nextConfig)
 
-  if (!process.env.NEXT_DISABLE_EDGE_IMAGES) {
+  if (!destr(process.env.NEXT_DISABLE_EDGE_IMAGES) && !destr(process.env.NEXT_DISABLE_NETLIFY_EDGE)) {
     console.log(
       'Using Netlify Edge Functions for image format detection. Set env var "NEXT_DISABLE_EDGE_IMAGES=true" to disable.',
     )
@@ -221,14 +223,17 @@ export const writeEdgeFunctions = async (netlifyConfig: NetlifyConfig) => {
       path: '/_next/image*',
     })
   }
-  if (process.env.NEXT_DISABLE_NETLIFY_EDGE !== 'true' && process.env.NEXT_DISABLE_NETLIFY_EDGE !== '1') {
+  if (!destr(process.env.NEXT_DISABLE_NETLIFY_EDGE)) {
     const middlewareManifest = await loadMiddlewareManifest(netlifyConfig)
     if (!middlewareManifest) {
       console.error("Couldn't find the middleware manifest")
       return
     }
 
+    let usesEdge = false
+
     for (const middleware of middlewareManifest.sortedMiddleware) {
+      usesEdge = true
       const edgeFunctionDefinition = middlewareManifest.middleware[middleware]
       const functionDefinitions = await writeEdgeFunction({
         edgeFunctionDefinition,
@@ -241,6 +246,7 @@ export const writeEdgeFunctions = async (netlifyConfig: NetlifyConfig) => {
     // No, the version field was not incremented
     if (typeof middlewareManifest.functions === 'object') {
       for (const edgeFunctionDefinition of Object.values(middlewareManifest.functions)) {
+        usesEdge = true
         const functionDefinitions = await writeEdgeFunction({
           edgeFunctionDefinition,
           edgeFunctionRoot,
@@ -249,6 +255,12 @@ export const writeEdgeFunctions = async (netlifyConfig: NetlifyConfig) => {
         manifest.functions.push(...functionDefinitions)
       }
     }
+    if (usesEdge) {
+      console.log(outdent`
+        ✨ Deploying middleware and functions to ${greenBright`Netlify Edge Functions`} ✨
+        This feature is in beta. Please share your feedback here: https://ntl.fyi/next-netlify-edge
+      `)
+    }
   }
   await writeJson(join(edgeFunctionRoot, 'manifest.json'), manifest)
 }