chore: refactor

Author: ascorbic

.vscode/settings.json

@@ -2,7 +2,6 @@
   "deno.enablePaths": [
     "packages/runtime/src/templates/edge",
     "demos/middleware/.netlify/edge-functions",
-    "demos/middleware/netlify/edge-functions",
     "demos/server-components/.netlify/edge-functions",
   ],
   "deno.unstable": true

demos/middleware/netlify.toml

@@ -3,12 +3,8 @@ command = "npm run build"
 publish = ".next"
 ignore = "if [ $CACHED_COMMIT_REF == $COMMIT_REF ]; then (exit 1); else git diff --quiet $CACHED_COMMIT_REF $COMMIT_REF ../..; fi;"
 
-[build.environment]
-NEXT_USE_NETLIFY_EDGE = "true"
-
-[[plugins]]
-package = "../plugin-wrapper/"
-
+# [[plugins]]
+# package = "../plugin-wrapper/"
 # This is a fake plugin, that makes it run npm install
 [[plugins]]
 package = "@netlify/plugin-local-install-core"
@@ -18,6 +14,7 @@ included_files = [
     "!node_modules/sharp/vendor/8.12.2/darwin-*/**/*",
     "!node_modules/sharp/build/Release/sharp-darwin-*"
 ]
+# Uncomment this if testing the built files rather than dev
 # [dev]
 # framework = "#static"
 # [[redirects]]

demos/middleware/tsconfig.json

@@ -17,7 +17,6 @@
   },
   "exclude": [
     "node_modules",
-    "netlify/edge-functions/**/*",
     "../../src/templates/edge/*"
   ],
   "include": [

packages/next/src/middleware/request.ts

@@ -50,9 +50,7 @@ export class MiddlewareRequest extends Request {
   }
 
   /**
-   *
-   * @param options
-   * @returns
+   * Passes the request to the origin, allowing you to access the response
    */
   async next(options?: NextOptions): Promise<MiddlewareResponse> {
     this.applyHeaders()

packages/runtime/src/helpers/dev.ts

@@ -0,0 +1,44 @@
+import { resolve } from 'path'
+
+import { NetlifyPlugin } from '@netlify/build'
+import execa from 'execa'
+import { unlink, existsSync } from 'fs-extra'
+
+import { writeDevEdgeFunction } from './edge'
+import { patchNextFiles } from './files'
+
+// The types haven't been updated yet
+export const onPreDev: NetlifyPlugin['onPreBuild'] = async ({ constants, netlifyConfig }) => {
+  // Need to patch the files, because build might not have been run
+  await patchNextFiles(resolve(netlifyConfig.build.publish, '..'))
+
+  //  Clean up old functions
+  await unlink(resolve('.netlify', 'middleware.js')).catch(() => {
+    // Ignore if it doesn't exist
+  })
+  await writeDevEdgeFunction(constants)
+  if (
+    !existsSync(resolve(netlifyConfig.build.base, 'middleware.ts')) &&
+    !existsSync(resolve(netlifyConfig.build.base, 'middleware.js'))
+  ) {
+    console.log(
+      "No middleware found. Create a 'middleware.ts' or 'middleware.js' file in your project root to add custom middleware.",
+    )
+  } else {
+    console.log('Watching for changes in Next.js middleware...')
+  }
+  // Eventually we might want to do this via esbuild's API, but for now the CLI works fine
+  const childProcess = execa(`esbuild`, [
+    `--bundle`,
+    `--outdir=${resolve('.netlify')}`,
+    `--format=esm`,
+    '--watch',
+    // Watch for both, because it can have either ts or js
+    resolve(netlifyConfig.build.base, 'middleware.ts'),
+    resolve(netlifyConfig.build.base, 'middleware.js'),
+  ])
+
+  childProcess.stdout.pipe(process.stdout)
+  childProcess.stderr.pipe(process.stderr)
+  // Don't return the promise because we don't want to wait for the child process to finish
+}

packages/runtime/src/index.ts

@@ -1,10 +1,9 @@
 /* eslint-disable max-lines */
-import { join, relative, resolve } from 'path'
+import { join, relative } from 'path'
 
 import type { NetlifyPlugin, OnPreBuild } from '@netlify/build'
 import { greenBright, yellowBright, bold } from 'chalk'
-import execa from 'execa'
-import { existsSync, readFileSync, unlink } from 'fs-extra'
+import { existsSync, readFileSync } from 'fs-extra'
 import { outdent } from 'outdent'
 
 import { HANDLER_FUNCTION_NAME, ODB_FUNCTION_NAME } from './constants'
@@ -16,7 +15,8 @@ import {
   configureHandlerFunctions,
   generateCustomHeaders,
 } from './helpers/config'
-import { updateConfig, writeEdgeFunctions, loadMiddlewareManifest, writeDevEdgeFunction } from './helpers/edge'
+import { onPreDev } from './helpers/dev'
+import { updateConfig, writeEdgeFunctions, loadMiddlewareManifest } from './helpers/edge'
 import { moveStaticPages, movePublicFiles, patchNextFiles } from './helpers/files'
 import { generateFunctions, setupImageFunction, generatePagesResolver } from './helpers/functions'
 import { generateRedirects, generateStaticRedirects } from './helpers/redirects'
@@ -219,40 +219,7 @@ const nextPlugin = (_inputs, meta: { events: Set<string> }): NetlifyPlugin & { o
   }
   return {
     ...plugin,
-    onPreDev: async ({ constants, netlifyConfig }) => {
-      // Need to patch the files, because build might not have been run
-      await patchNextFiles(resolve(netlifyConfig.build.publish, '..'))
-
-      //  Clean up old functions
-      await unlink(resolve('.netlify', 'middleware.js')).catch(() => {
-        // Ignore if it doesn't exist
-      })
-      await writeDevEdgeFunction(constants)
-      if (
-        !existsSync(resolve(netlifyConfig.build.base, 'middleware.ts')) &&
-        !existsSync(resolve(netlifyConfig.build.base, 'middleware.js'))
-      ) {
-        console.log(
-          "No middleware found. Create a 'middleware.ts' or 'middleware.js' file in your project root to add custom middleware.",
-        )
-      } else {
-        console.log('Watching for changes in Next.js middleware...')
-      }
-      // Eventually we might want to do this via esbuild's API, but for now the CLI works fine
-      const childProcess = execa(`esbuild`, [
-        `--bundle`,
-        `--outdir=${resolve('.netlify')}`,
-        `--format=esm`,
-        '--watch',
-        // Watch for both, because it can have either ts or js
-        resolve(netlifyConfig.build.base, 'middleware.ts'),
-        resolve(netlifyConfig.build.base, 'middleware.js'),
-      ])
-
-      childProcess.stdout.pipe(process.stdout)
-      childProcess.stderr.pipe(process.stderr)
-      // Don't return the promise because we don't want to wait for the child process to finish
-    },
+    onPreDev,
   }
 }