diff --git a/packages/next/build/webpack/loaders/next-flight-client-loader.ts b/packages/next/build/webpack/loaders/next-flight-client-loader.ts
index 326fe9589ab26f9..16016d1ac967458 100644
--- a/packages/next/build/webpack/loaders/next-flight-client-loader.ts
+++ b/packages/next/build/webpack/loaders/next-flight-client-loader.ts
@@ -10,6 +10,8 @@ import { promisify } from 'util'
 import { parse } from '../../swc'
 import { buildExports } from './utils'
 
+const IS_NEXT_CLIENT_BUILT_IN = /[\\/]next[\\/](link|image)\.js$/
+
 function addExportNames(names: string[], node: any) {
   if (!node) return
   switch (node.type) {
@@ -57,7 +59,7 @@ async function collectExports(
   const names: string[] = []
 
   // Next.js built-in client components
-  if (/[\\/]next[\\/](link|image)\.js$/.test(resourcePath)) {
+  if (IS_NEXT_CLIENT_BUILT_IN.test(resourcePath)) {
     names.push('default')
   }
 
@@ -158,12 +160,14 @@ export default async function transformSource(
   const moduleRefDef =
     "const MODULE_REFERENCE = Symbol.for('react.module.reference');\n"
 
+  const isNextClientBuiltIn = IS_NEXT_CLIENT_BUILT_IN.test(resourcePath)
+
   const clientRefsExports = names.reduce((res: any, name) => {
     const moduleRef =
       '{ $$typeof: MODULE_REFERENCE, filepath: ' +
       JSON.stringify(resourcePath) +
       ', name: ' +
-      JSON.stringify(name) +
+      JSON.stringify(name === 'default' && isNextClientBuiltIn ? '' : name) +
       ' };\n'
     res[name] = moduleRef
     return res
diff --git a/packages/next/taskfile-swc.js b/packages/next/taskfile-swc.js
index 38395cc19aefb04..71f79fc8647748f 100644
--- a/packages/next/taskfile-swc.js
+++ b/packages/next/taskfile-swc.js
@@ -14,7 +14,11 @@ module.exports = function (task) {
     function* (
       file,
       serverOrClient,
-      { stripExtension, keepImportAssertions = false } = {}
+      {
+        stripExtension,
+        keepImportAssertions = false,
+        interopClientDefaultExport = false,
+      } = {}
     ) {
       // Don't compile .d.ts
       if (file.base.endsWith('.d.ts')) return
@@ -111,6 +115,15 @@ module.exports = function (task) {
       }
 
       if (output.map) {
+        if (interopClientDefaultExport) {
+          output.code += `
+if (typeof exports.default === 'function' || (typeof exports.default === 'object' && exports.default !== null)) {
+  Object.assign(exports.default, exports);
+  module.exports = exports.default;
+}
+`
+        }
+
         const map = `${file.base}.map`
 
         output.code += Buffer.from(`\n//# sourceMappingURL=${map}`)
diff --git a/packages/next/taskfile.js b/packages/next/taskfile.js
index fc4a1ee697fa957..c9064ba074d39c9 100644
--- a/packages/next/taskfile.js
+++ b/packages/next/taskfile.js
@@ -1826,7 +1826,7 @@ export async function nextbuild(task, opts) {
 export async function client(task, opts) {
   await task
     .source(opts.src || 'client/**/*.+(js|ts|tsx)')
-    .swc('client', { dev: opts.dev })
+    .swc('client', { dev: opts.dev, interopClientDefaultExport: true })
     .target('dist/client')
   notify('Compiled client files')
 }