diff --git a/next.config.js b/next.config.js
index ee0c11b19..ba1a4354e 100644
--- a/next.config.js
+++ b/next.config.js
@@ -1,67 +1,6 @@
-const path = require('path')
-
+const { withPayload } = require('./packages/next/src/withPayload')
 const withBundleAnalyzer = require('@next/bundle-analyzer')({
   enabled: process.env.ANALYZE === 'true',
 })
 
-/** @type {import('next').NextConfig} */
-const nextConfig = {
-  experimental: {
-    outputFileTracingExcludes: {
-      '**/*': ['drizzle-kit', 'drizzle-kit/utils'],
-    },
-    serverComponentsExternalPackages: ['drizzle-kit', 'drizzle-kit/utils', 'pino', 'pino-pretty'],
-    turbo: {
-      resolveAlias: {
-        '@payloadcms/ui/scss': path.resolve(__dirname, './packages/ui/src/scss/styles.scss'),
-        'payload-config': path.resolve(__dirname, process.env.PAYLOAD_CONFIG_PATH),
-      },
-    },
-  },
-  reactStrictMode: false,
-  // typescript: {
-  //   ignoreBuildErrors: true,
-  // },
-
-  webpack: (config) => {
-    return {
-      ...config,
-      externals: [
-        ...config.externals,
-        'drizzle-kit',
-        'drizzle-kit/utils',
-        'pino',
-        'pino-pretty',
-        'sharp',
-      ],
-      ignoreWarnings: [
-        ...(config.ignoreWarnings || []),
-        { module: /node_modules\/mongodb\/lib\/utils\.js/ },
-        { file: /node_modules\/mongodb\/lib\/utils\.js/ },
-        { module: /node_modules\/mongodb\/lib\/bson\.js/ },
-        { file: /node_modules\/mongodb\/lib\/bson\.js/ },
-      ],
-      resolve: {
-        ...config.resolve,
-        alias: {
-          ...config.resolve.alias,
-          '@payloadcms/ui/scss': path.resolve(__dirname, './packages/ui/src/scss/styles.scss'),
-          'payload-config': path.resolve(__dirname, process.env.PAYLOAD_CONFIG_PATH),
-        },
-        fallback: {
-          ...config.resolve.fallback,
-          '@aws-sdk/credential-providers': false,
-          '@mongodb-js/zstd': false,
-          aws4: false,
-          kerberos: false,
-          'mongodb-client-encryption': false,
-          snappy: false,
-          'supports-color': false,
-          'yocto-queue': false,
-        },
-      },
-    }
-  },
-}
-
-module.exports = withBundleAnalyzer(nextConfig)
+module.exports = withBundleAnalyzer(withPayload())
diff --git a/packages/next/package.json b/packages/next/package.json
index 714a5123e..7e7b063ae 100644
--- a/packages/next/package.json
+++ b/packages/next/package.json
@@ -19,24 +19,29 @@
     "prepublishOnly": "pnpm clean && pnpm build"
   },
   "exports": {
+    "./*": {
+      "import": "./dist/exports/*.js",
+      "require": "./dist/exports/*.js",
+      "types": "./dist/exports/*.ts"
+    },
     "./utilities/*": {
-      "import": "./src/utilities/*.ts",
-      "require": "./src/utilities/*.ts",
+      "import": "./dist/utilities/*.js",
+      "require": "./dist/utilities/*.js",
       "types": "./src/utilities/*.ts"
     },
     "./layouts/*": {
-      "import": "./src/layouts/*.ts",
-      "require": "./src/layouts/*.ts",
+      "import": "./dist/layouts/*.js",
+      "require": "./dist/layouts/*.js",
       "types": "./src/layouts/*.ts"
     },
     "./pages/*": {
-      "import": "./src/pages/*.ts",
-      "require": "./src/pages/*.ts",
+      "import": "./dist/pages/*.js",
+      "require": "./dist/pages/*.js",
       "types": "./src/pages/*.ts"
     },
     "./routes": {
-      "import": "./src/routes/index.ts",
-      "require": "./src/routes/index.ts"
+      "import": "./dist/routes/index.js",
+      "require": "./dist/routes/index.js"
     }
   },
   "devDependencies": {
diff --git a/packages/next/src/exports/index.ts b/packages/next/src/exports/index.ts
new file mode 100644
index 000000000..ea096606a
--- /dev/null
+++ b/packages/next/src/exports/index.ts
@@ -0,0 +1 @@
+export { withPayload } from '../withPayload'
diff --git a/packages/next/src/withPayload.js b/packages/next/src/withPayload.js
new file mode 100644
index 000000000..f640caf0b
--- /dev/null
+++ b/packages/next/src/withPayload.js
@@ -0,0 +1,81 @@
+const path = require('path')
+
+/** @type {import('next').NextConfig} */
+const withPayload = (nextConfig = {}) => {
+  const aliases = {
+    'payload-config': path.resolve(process.cwd(), process.env.PAYLOAD_CONFIG_PATH),
+  }
+
+  return {
+    ...nextConfig,
+    experimental: {
+      ...(nextConfig?.experimental || {}),
+      outputFileTracingExcludes: {
+        '**/*': [
+          ...(nextConfig.experimental?.outputFileTracingExcludes?.['**/*'] || []),
+          'drizzle-kit',
+          'drizzle-kit/utils',
+        ],
+      },
+      serverComponentsExternalPackages: [
+        ...(nextConfig?.experimental?.serverComponentsExternalPackages || []),
+        'drizzle-kit',
+        'drizzle-kit/utils',
+        'pino',
+        'pino-pretty',
+      ],
+      turbo: {
+        ...(nextConfig?.experimental?.turbo || {}),
+        resolveAlias: {
+          ...(nextConfig?.experimental?.turbo?.resolveAlias || {}),
+          ...aliases,
+        },
+      },
+    },
+    webpack: (webpackConfig, webpackOptions) => {
+      const incomingWebpackConfig =
+        typeof nextConfig.webpack === 'function'
+          ? nextConfig.webpack(webpackConfig, webpackOptions)
+          : webpackConfig
+
+      return {
+        ...incomingWebpackConfig,
+        externals: [
+          ...(incomingWebpackConfig?.externals || []),
+          'drizzle-kit',
+          'drizzle-kit/utils',
+          'pino',
+          'pino-pretty',
+          'sharp',
+        ],
+        ignoreWarnings: [
+          ...(incomingWebpackConfig?.ignoreWarnings || []),
+          { module: /node_modules\/mongodb\/lib\/utils\.js/ },
+          { file: /node_modules\/mongodb\/lib\/utils\.js/ },
+          { module: /node_modules\/mongodb\/lib\/bson\.js/ },
+          { file: /node_modules\/mongodb\/lib\/bson\.js/ },
+        ],
+        resolve: {
+          ...(incomingWebpackConfig?.resolve || {}),
+          alias: {
+            ...(incomingWebpackConfig?.resolve?.alias || {}),
+            ...aliases,
+          },
+          fallback: {
+            ...(incomingWebpackConfig?.resolve?.fallback || {}),
+            '@aws-sdk/credential-providers': false,
+            '@mongodb-js/zstd': false,
+            aws4: false,
+            kerberos: false,
+            'mongodb-client-encryption': false,
+            snappy: false,
+            'supports-color': false,
+            'yocto-queue': false,
+          },
+        },
+      }
+    },
+  }
+}
+
+module.exports = { withPayload }
diff --git a/packages/next/tsconfig.json b/packages/next/tsconfig.json
index a298b5553..d3b7974da 100644
--- a/packages/next/tsconfig.json
+++ b/packages/next/tsconfig.json
@@ -19,7 +19,11 @@
     "src/**/*.spec.tsx",
     "src/**/*.json"
   ],
-  "include": ["src/**/*.ts", "src/**/*.tsx"],
+  "include": [
+    "src/**/*.ts",
+    "src/**/*.tsx",
+    "src/withPayload.js" /* Include the withPayload.js file in the build */
+  ],
   "references": [
     { "path": "../payload" },
     { "path": "../ui" },
diff --git a/tsconfig.json b/tsconfig.json
index c63f9e70e..977db6c3e 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -42,6 +42,7 @@
       ],
       "@payloadcms/translations/api": ["./packages/translations/src/_generatedFiles_/api/index.js"],
       "@payloadcms/next/*": ["./packages/next/src/*"],
+      "@payloadcms/next": ["./packages/next/src/exports/*"],
       "@payloadcms/graphql": ["./packages/graphql/src"]
     }
   },