[edge] support edge-light exports when bundling edge functions (#45188)

This PR implements `edge-light` as a main field for bundling edge functions as defined in https://runtime-keys.proposal.wintercg.org Resolves EC-614 ## Feature - [ ] Implements an existing feature request or RFC. Make sure the feature request has been accepted for implementation before opening a PR. - [ ] Related issues linked using `fixes #number` - [ ] [e2e](https://github.com/vercel/next.js/blob/canary/contributing/core/testing.md#writing-tests-for-nextjs) tests added - [ ] Documentation added - [ ] Telemetry added. In case of a feature if it's used or not. - [ ] Errors have a helpful link attached, see [`contributing.md`](https://github.com/vercel/next.js/blob/canary/contributing.md) ---------
vercel · Feb 16, 2023 · 282c1a0 · 282c1a0
1 parent f3b231c
commit 282c1a0
Show file tree

Hide file tree

Showing 23 changed files with 150 additions and 3 deletions.
diff --git a/packages/next/src/build/webpack-config.ts b/packages/next/src/build/webpack-config.ts
@@ -903,13 +903,13 @@ export default async function getBaseWebpackConfig(
   const mainFieldsPerCompiler: Record<typeof compilerType, string[]> = {
     [COMPILER_NAMES.server]: ['main', 'module'],
     [COMPILER_NAMES.client]: ['browser', 'module', 'main'],
-    [COMPILER_NAMES.edgeServer]: ['browser', 'module', 'main'],
+    [COMPILER_NAMES.edgeServer]: ['edge-light', 'browser', 'module', 'main'],
   }
 
   const reactDir = path.dirname(require.resolve('react/package.json'))
   const reactDomDir = path.dirname(require.resolve('react-dom/package.json'))
 
-  const resolveConfig = {
+  const resolveConfig: webpack.Configuration['resolve'] = {
     // Disable .mjs for node_modules bundling
     extensions: isNodeServer
       ? ['.js', '.mjs', '.tsx', '.ts', '.jsx', '.json', '.wasm']
@@ -1022,6 +1022,7 @@ export default async function getBaseWebpackConfig(
         }
       : undefined),
     mainFields: mainFieldsPerCompiler[compilerType],
+    ...(isEdgeServer && { conditionNames: ['edge-light', 'import', 'node'] }),
     plugins: [],
   }
 
@@ -1723,7 +1724,13 @@ export default async function getBaseWebpackConfig(
                   return true
                 },
                 resolve: {
-                  conditionNames: ['react-server', 'node', 'import', 'require'],
+                  conditionNames: [
+                    'react-server',
+                    ...(!isEdgeServer ? [] : ['edge-light']),
+                    'node',
+                    'import',
+                    'require',
+                  ],
                   alias: {
                     // If missing the alias override here, the default alias will be used which aliases
                     // react to the direct file path, not the package name. In that case the condition

diff --git a/test/e2e/edge-runtime-uses-edge-light-import-specifier-for-packages/app/app-dir/page.js b/test/e2e/edge-runtime-uses-edge-light-import-specifier-for-packages/app/app-dir/page.js
@@ -0,0 +1,12 @@
+import edgeLightPackage from 'my-edge-light-package'
+import edgeLightPackageExports from 'my-edge-light-package-exports'
+
+export const runtime = 'edge'
+
+export default function AppDirPage() {
+  return (
+    <pre id="result">
+      {JSON.stringify({ edgeLightPackage, edgeLightPackageExports }, null, 2)}
+    </pre>
+  )
+}
diff --git a/test/e2e/edge-runtime-uses-edge-light-import-specifier-for-packages/app/layout.js b/test/e2e/edge-runtime-uses-edge-light-import-specifier-for-packages/app/layout.js
@@ -0,0 +1,8 @@
+export default function RootLayout({ children }) {
+  return (
+    <html>
+      <head />
+      <body>{children}</body>
+    </html>
+  )
+}
diff --git a/...specifier-for-packages/edge-runtime-uses-edge-light-import-specifier-for-packages.test.ts b/...specifier-for-packages/edge-runtime-uses-edge-light-import-specifier-for-packages.test.ts
@@ -0,0 +1,49 @@
+import { createNextDescribe } from 'e2e-utils'
+
+createNextDescribe(
+  'edge-runtime uses edge-light import specifier for packages',
+  {
+    files: __dirname,
+    packageJson: {
+      scripts: {
+        setup: 'cp -r ./node_modules_bak/* ./node_modules',
+        build: 'yarn setup && next build',
+        dev: 'yarn setup && next dev',
+        start: 'next start',
+      },
+    },
+    installCommand: 'yarn',
+    startCommand: (global as any).isNextDev ? 'yarn dev' : 'yarn start',
+    buildCommand: 'yarn build',
+    skipDeployment: true,
+  },
+  ({ next }) => {
+    // In case you need to test the response object
+    it('pages/api endpoints import the correct module', async () => {
+      const res = await next.fetch('/api/edge')
+      const html = await res.json()
+      expect(html).toEqual({
+        edgeLightPackage: 'edge-light',
+        edgeLightPackageExports: 'edge-light',
+      })
+    })
+
+    it('pages import the correct module', async () => {
+      const $ = await next.render$('/')
+      const text = JSON.parse($('pre#result').text())
+      expect(text).toEqual({
+        edgeLightPackage: 'edge-light',
+        edgeLightPackageExports: 'edge-light',
+      })
+    })
+
+    it('app-dir imports the correct module', async () => {
+      const $ = await next.render$('/app-dir')
+      const text = JSON.parse($('pre#result').text())
+      expect(text).toEqual({
+        edgeLightPackage: 'edge-light',
+        edgeLightPackageExports: 'edge-light',
+      })
+    })
+  }
+)
diff --git a/test/e2e/edge-runtime-uses-edge-light-import-specifier-for-packages/next.config.js b/test/e2e/edge-runtime-uses-edge-light-import-specifier-for-packages/next.config.js
@@ -0,0 +1,5 @@
+module.exports = {
+  experimental: {
+    appDir: true,
+  },
+}
diff --git a/...ht-import-specifier-for-packages/node_modules/my-edge-light-package-exports/edge-light.js b/...ht-import-specifier-for-packages/node_modules/my-edge-light-package-exports/edge-light.js
diff --git a/...-light-import-specifier-for-packages/node_modules/my-edge-light-package-exports/import.js b/...-light-import-specifier-for-packages/node_modules/my-edge-light-package-exports/import.js
diff --git a/...ght-import-specifier-for-packages/node_modules/my-edge-light-package-exports/package.json b/...ght-import-specifier-for-packages/node_modules/my-edge-light-package-exports/package.json
diff --git a/...light-import-specifier-for-packages/node_modules/my-edge-light-package-exports/require.js b/...light-import-specifier-for-packages/node_modules/my-edge-light-package-exports/require.js
diff --git a/...edge-light-import-specifier-for-packages/node_modules/my-edge-light-package/edge-light.js b/...edge-light-import-specifier-for-packages/node_modules/my-edge-light-package/edge-light.js
diff --git a/...ses-edge-light-import-specifier-for-packages/node_modules/my-edge-light-package/import.js b/...ses-edge-light-import-specifier-for-packages/node_modules/my-edge-light-package/import.js
diff --git a/...-edge-light-import-specifier-for-packages/node_modules/my-edge-light-package/package.json b/...-edge-light-import-specifier-for-packages/node_modules/my-edge-light-package/package.json
diff --git a/...es-edge-light-import-specifier-for-packages/node_modules/my-edge-light-package/require.js b/...es-edge-light-import-specifier-for-packages/node_modules/my-edge-light-package/require.js
diff --git a/...mport-specifier-for-packages/node_modules_bak/my-edge-light-package-exports/edge-light.js b/...mport-specifier-for-packages/node_modules_bak/my-edge-light-package-exports/edge-light.js
@@ -0,0 +1 @@
+export default 'edge-light'
diff --git a/...ht-import-specifier-for-packages/node_modules_bak/my-edge-light-package-exports/import.js b/...ht-import-specifier-for-packages/node_modules_bak/my-edge-light-package-exports/import.js
@@ -0,0 +1 @@
+export default 'import'
diff --git a/...import-specifier-for-packages/node_modules_bak/my-edge-light-package-exports/package.json b/...import-specifier-for-packages/node_modules_bak/my-edge-light-package-exports/package.json
@@ -0,0 +1,9 @@
+{
+  "name": "my-edge-light-package-exports",
+  "main": "./require.js",
+  "exports": {
+    "edge-light": "./edge-light.js",
+    "require": "./require.js",
+    "import": "./import.js"
+  }
+}
diff --git a/...t-import-specifier-for-packages/node_modules_bak/my-edge-light-package-exports/require.js b/...t-import-specifier-for-packages/node_modules_bak/my-edge-light-package-exports/require.js
@@ -0,0 +1 @@
+module.exports = 'require'
diff --git a/...-light-import-specifier-for-packages/node_modules_bak/my-edge-light-package/edge-light.js b/...-light-import-specifier-for-packages/node_modules_bak/my-edge-light-package/edge-light.js
@@ -0,0 +1 @@
+export default 'edge-light'
diff --git a/...edge-light-import-specifier-for-packages/node_modules_bak/my-edge-light-package/import.js b/...edge-light-import-specifier-for-packages/node_modules_bak/my-edge-light-package/import.js
@@ -0,0 +1 @@
+export default 'import'
diff --git a/...e-light-import-specifier-for-packages/node_modules_bak/my-edge-light-package/package.json b/...e-light-import-specifier-for-packages/node_modules_bak/my-edge-light-package/package.json
@@ -0,0 +1,6 @@
+{
+  "name": "my-edge-light-package",
+  "main": "./require.js",
+  "module": "./import.js",
+  "edge-light": "./edge-light.js"
+}
diff --git a/...dge-light-import-specifier-for-packages/node_modules_bak/my-edge-light-package/require.js b/...dge-light-import-specifier-for-packages/node_modules_bak/my-edge-light-package/require.js
@@ -0,0 +1 @@
+module.exports = 'require'
diff --git a/test/e2e/edge-runtime-uses-edge-light-import-specifier-for-packages/pages/api/edge.js b/test/e2e/edge-runtime-uses-edge-light-import-specifier-for-packages/pages/api/edge.js
@@ -0,0 +1,12 @@
+import edgeLightPackage from 'my-edge-light-package'
+import edgeLightPackageExports from 'my-edge-light-package-exports'
+import { NextResponse } from 'next/server'
+
+export const config = { runtime: 'edge' }
+
+export default function MyEdgeFunction() {
+  return NextResponse.json({
+    edgeLightPackage,
+    edgeLightPackageExports,
+  })
+}
diff --git a/test/e2e/edge-runtime-uses-edge-light-import-specifier-for-packages/pages/index.js b/test/e2e/edge-runtime-uses-edge-light-import-specifier-for-packages/pages/index.js
@@ -0,0 +1,12 @@
+import edgeLightPackage from 'my-edge-light-package'
+import edgeLightPackageExports from 'my-edge-light-package-exports'
+
+export const config = { runtime: 'experimental-edge' }
+
+export default function Index() {
+  return (
+    <pre id="result">
+      {JSON.stringify({ edgeLightPackage, edgeLightPackageExports }, null, 2)}
+    </pre>
+  )
+}