diff --git a/packages/next/src/build/create-compiler-aliases.ts b/packages/next/src/build/create-compiler-aliases.ts
index 37da16736475d..d1a8c8463876a 100644
--- a/packages/next/src/build/create-compiler-aliases.ts
+++ b/packages/next/src/build/create-compiler-aliases.ts
@@ -276,7 +276,7 @@ export function createRSCAliases(
         'react-dom$': `next/dist/server/future/route-modules/app-page/vendored/${layer}/react-dom`,
         'react-server-dom-webpack/client.edge$': `next/dist/server/future/route-modules/app-page/vendored/${layer}/react-server-dom-webpack-client-edge`,
       })
-    } else if (layer === WEBPACK_LAYERS.reactServerComponents) {
+    } else if (layer === WEBPACK_LAYERS.serverComponents) {
       alias = Object.assign(alias, {
         'react/jsx-runtime$': `next/dist/server/future/route-modules/app-page/vendored/${layer}/react-jsx-runtime`,
         'react/jsx-dev-runtime$': `next/dist/server/future/route-modules/app-page/vendored/${layer}/react-jsx-dev-runtime`,
@@ -289,7 +289,7 @@ export function createRSCAliases(
   }
 
   if (isEdgeServer) {
-    if (layer === WEBPACK_LAYERS.reactServerComponents) {
+    if (layer === WEBPACK_LAYERS.serverComponents) {
       alias = Object.assign(alias, {
         react$: `next/dist/compiled/react${bundledReactChannel}/react.react-server`,
         'next/dist/compiled/react$': `next/dist/compiled/react${bundledReactChannel}/react.react-server`,
diff --git a/packages/next/src/build/entries.ts b/packages/next/src/build/entries.ts
index 784d1aead8fb2..b65d496ff5bae 100644
--- a/packages/next/src/build/entries.ts
+++ b/packages/next/src/build/entries.ts
@@ -365,7 +365,7 @@ export function getEdgeServerEntry(opts: {
 
     return {
       import: `next-edge-app-route-loader?${stringify(loaderParams)}!`,
-      layer: WEBPACK_LAYERS.reactServerComponents,
+      layer: WEBPACK_LAYERS.serverComponents,
     }
   }
 
@@ -452,7 +452,7 @@ export function getInstrumentationEntry(opts: {
 export function getAppEntry(opts: Readonly<AppLoaderOptions>) {
   return {
     import: `next-app-loader?${stringify(opts)}!`,
-    layer: WEBPACK_LAYERS.reactServerComponents,
+    layer: WEBPACK_LAYERS.serverComponents,
   }
 }
 
@@ -796,13 +796,11 @@ export function finalizeEntrypoint({
 
   switch (compilerType) {
     case COMPILER_NAMES.server: {
-      const layer = isApi
-        ? WEBPACK_LAYERS.api
-        : isInstrumentation
-          ? WEBPACK_LAYERS.instrument
-          : isServerComponent
-            ? WEBPACK_LAYERS.reactServerComponents
-            : undefined
+      const layer = isInstrumentation
+        ? WEBPACK_LAYERS.instrument
+        : isServerComponent || isApi
+          ? WEBPACK_LAYERS.serverComponents
+          : undefined
 
       return {
         publicPath: isApi ? '' : undefined,
@@ -815,7 +813,7 @@ export function finalizeEntrypoint({
       return {
         layer:
           isMiddlewareFilename(name) || isApi || isInstrumentation
-            ? WEBPACK_LAYERS.middleware
+            ? WEBPACK_LAYERS.serverComponents
             : undefined,
         library: { name: ['_ENTRIES', `middleware_[name]`], type: 'assign' },
         runtime: EDGE_RUNTIME_WEBPACK,
diff --git a/packages/next/src/build/webpack-config.ts b/packages/next/src/build/webpack-config.ts
index 9b8fad90b9922..b24bd8a30dc11 100644
--- a/packages/next/src/build/webpack-config.ts
+++ b/packages/next/src/build/webpack-config.ts
@@ -460,7 +460,7 @@ export default async function getBaseWebpackConfig(
   // RSC loaders, prefer ESM, set `esm` to true
   const swcServerLayerLoader = getSwcLoader({
     serverComponents: true,
-    bundleLayer: WEBPACK_LAYERS.reactServerComponents,
+    bundleLayer: WEBPACK_LAYERS.serverComponents,
     esm: true,
   })
   const swcSSRLayerLoader = getSwcLoader({
@@ -510,7 +510,7 @@ export default async function getBaseWebpackConfig(
     // acceptable as Babel will not be recommended.
     getSwcLoader({
       serverComponents: false,
-      bundleLayer: WEBPACK_LAYERS.middleware,
+      bundleLayer: WEBPACK_LAYERS.serverComponents,
     }),
     babelLoader,
   ].filter(Boolean)
@@ -557,13 +557,12 @@ export default async function getBaseWebpackConfig(
   // Loader for API routes needs to be differently configured as it shouldn't
   // have RSC transpiler enabled, so syntax checks such as invalid imports won't
   // be performed.
-  const apiRoutesLayerLoaders =
-    hasAppDir && useSWCLoader
-      ? getSwcLoader({
-          serverComponents: false,
-          bundleLayer: WEBPACK_LAYERS.api,
-        })
-      : defaultLoaders.babel
+  const apiRoutesLayerLoaders = useSWCLoader
+    ? getSwcLoader({
+        serverComponents: true,
+        bundleLayer: WEBPACK_LAYERS.serverComponents,
+      })
+    : defaultLoaders.babel
 
   const pageExtensions = config.pageExtensions
 
@@ -1345,7 +1344,7 @@ export default async function getBaseWebpackConfig(
                   alias: createRSCAliases(bundledReactChannel, {
                     // No server components profiling
                     reactProductionProfiling,
-                    layer: WEBPACK_LAYERS.reactServerComponents,
+                    layer: WEBPACK_LAYERS.serverComponents,
                     isEdgeServer,
                   }),
                 },
@@ -1376,7 +1375,7 @@ export default async function getBaseWebpackConfig(
                 resourceQuery: new RegExp(
                   WEBPACK_RESOURCE_QUERIES.edgeSSREntry
                 ),
-                layer: WEBPACK_LAYERS.reactServerComponents,
+                layer: WEBPACK_LAYERS.serverComponents,
               },
             ]
           : []),
@@ -1403,7 +1402,7 @@ export default async function getBaseWebpackConfig(
                       // when react is acting as dependency of compiled/react-dom.
                       alias: createRSCAliases(bundledReactChannel, {
                         reactProductionProfiling,
-                        layer: WEBPACK_LAYERS.reactServerComponents,
+                        layer: WEBPACK_LAYERS.serverComponents,
                         isEdgeServer,
                       }),
                     },
@@ -1457,7 +1456,7 @@ export default async function getBaseWebpackConfig(
           oneOf: [
             {
               ...codeCondition,
-              issuerLayer: WEBPACK_LAYERS.api,
+              issuerLayer: WEBPACK_LAYERS.serverComponents,
               parser: {
                 // Switch back to normal URL handling
                 url: true,
@@ -1466,7 +1465,7 @@ export default async function getBaseWebpackConfig(
             },
             {
               test: codeCondition.test,
-              issuerLayer: WEBPACK_LAYERS.middleware,
+              issuerLayer: WEBPACK_LAYERS.serverComponents,
               use: middlewareLayerLoaders,
             },
             {
@@ -1716,7 +1715,7 @@ export default async function getBaseWebpackConfig(
                 runtime = 'app-route'
                 break
               case WEBPACK_LAYERS.serverSideRendering:
-              case WEBPACK_LAYERS.reactServerComponents:
+              case WEBPACK_LAYERS.serverComponents:
               case WEBPACK_LAYERS.appPagesBrowser:
               case WEBPACK_LAYERS.actionBrowser:
                 runtime = 'app-page'
diff --git a/packages/next/src/build/webpack/config/blocks/css/index.ts b/packages/next/src/build/webpack/config/blocks/css/index.ts
index bda32eaab716c..084f44612f024 100644
--- a/packages/next/src/build/webpack/config/blocks/css/index.ts
+++ b/packages/next/src/build/webpack/config/blocks/css/index.ts
@@ -28,7 +28,7 @@ const regexSassModules = /\.module\.(scss|sass)$/
 
 const APP_LAYER_RULE = {
   or: [
-    WEBPACK_LAYERS.reactServerComponents,
+    WEBPACK_LAYERS.serverComponents,
     WEBPACK_LAYERS.serverSideRendering,
     WEBPACK_LAYERS.appPagesBrowser,
   ],
@@ -36,7 +36,7 @@ const APP_LAYER_RULE = {
 
 const PAGES_LAYER_RULE = {
   not: [
-    WEBPACK_LAYERS.reactServerComponents,
+    WEBPACK_LAYERS.serverComponents,
     WEBPACK_LAYERS.serverSideRendering,
     WEBPACK_LAYERS.appPagesBrowser,
   ],
diff --git a/packages/next/src/build/webpack/plugins/flight-client-entry-plugin.ts b/packages/next/src/build/webpack/plugins/flight-client-entry-plugin.ts
index 99403fee3df86..85b61616d28ea 100644
--- a/packages/next/src/build/webpack/plugins/flight-client-entry-plugin.ts
+++ b/packages/next/src/build/webpack/plugins/flight-client-entry-plugin.ts
@@ -905,7 +905,7 @@ export class FlightClientEntryPlugin {
         currentCompilerServerActions[id].workers[bundlePath] = ''
         currentCompilerServerActions[id].layer[bundlePath] = fromClient
           ? WEBPACK_LAYERS.actionBrowser
-          : WEBPACK_LAYERS.reactServerComponents
+          : WEBPACK_LAYERS.serverComponents
       }
     }
 
@@ -923,7 +923,7 @@ export class FlightClientEntryPlugin {
         name: entryName,
         layer: fromClient
           ? WEBPACK_LAYERS.actionBrowser
-          : WEBPACK_LAYERS.reactServerComponents,
+          : WEBPACK_LAYERS.serverComponents,
       }
     )
   }
diff --git a/packages/next/src/build/webpack/plugins/next-types-plugin/index.ts b/packages/next/src/build/webpack/plugins/next-types-plugin/index.ts
index 6321e0e4ac9c5..3d4e28503e31b 100644
--- a/packages/next/src/build/webpack/plugins/next-types-plugin/index.ts
+++ b/packages/next/src/build/webpack/plugins/next-types-plugin/index.ts
@@ -614,7 +614,7 @@ export class NextTypesPlugin {
         return
       }
       if (
-        mod.layer !== WEBPACK_LAYERS.reactServerComponents &&
+        mod.layer !== WEBPACK_LAYERS.serverComponents &&
         mod.layer !== WEBPACK_LAYERS.appRouteHandler
       )
         return
diff --git a/packages/next/src/lib/constants.ts b/packages/next/src/lib/constants.ts
index 7a0eaef0de69a..54eca5d9e1d29 100644
--- a/packages/next/src/lib/constants.ts
+++ b/packages/next/src/lib/constants.ts
@@ -115,9 +115,9 @@ const WEBPACK_LAYERS_NAMES = {
    */
   shared: 'shared',
   /**
-   * React Server Components layer (rsc).
+   * React Server Components layer, where apply react-server conditions.
    */
-  reactServerComponents: 'rsc',
+  serverComponents: 'react-server',
   /**
    * Server Side Rendering layer for app (ssr).
    */
@@ -129,11 +129,11 @@ const WEBPACK_LAYERS_NAMES = {
   /**
    * The layer for the API routes.
    */
-  api: 'api',
+  // api: 'api',
   /**
    * The layer for the middleware code.
    */
-  middleware: 'middleware',
+  // middleware: 'middleware',
   /**
    * The layer for the instrumentation hooks.
    */
@@ -163,23 +163,23 @@ const WEBPACK_LAYERS = {
   ...WEBPACK_LAYERS_NAMES,
   GROUP: {
     serverOnly: [
-      WEBPACK_LAYERS_NAMES.reactServerComponents,
+      WEBPACK_LAYERS_NAMES.serverComponents,
       WEBPACK_LAYERS_NAMES.actionBrowser,
       WEBPACK_LAYERS_NAMES.appMetadataRoute,
       WEBPACK_LAYERS_NAMES.appRouteHandler,
       WEBPACK_LAYERS_NAMES.instrument,
-      WEBPACK_LAYERS_NAMES.middleware,
+      // WEBPACK_LAYERS_NAMES.middleware,
     ],
     neutralTarget: [
       // pages api
-      WEBPACK_LAYERS_NAMES.api,
+      // WEBPACK_LAYERS_NAMES.api,
     ],
     clientOnly: [
       WEBPACK_LAYERS_NAMES.serverSideRendering,
       WEBPACK_LAYERS_NAMES.appPagesBrowser,
     ],
     app: [
-      WEBPACK_LAYERS_NAMES.reactServerComponents,
+      WEBPACK_LAYERS_NAMES.serverComponents,
       WEBPACK_LAYERS_NAMES.actionBrowser,
       WEBPACK_LAYERS_NAMES.appMetadataRoute,
       WEBPACK_LAYERS_NAMES.appRouteHandler,
diff --git a/packages/next/src/server/dev/hot-reloader-webpack.ts b/packages/next/src/server/dev/hot-reloader-webpack.ts
index ff8fa36d06053..8b354e7118618 100644
--- a/packages/next/src/server/dev/hot-reloader-webpack.ts
+++ b/packages/next/src/server/dev/hot-reloader-webpack.ts
@@ -1153,7 +1153,7 @@ export default class HotReloaderWebpack implements NextJsHotReloaderInterface {
                         .toString('hex')
 
                       if (
-                        mod.layer === WEBPACK_LAYERS.reactServerComponents &&
+                        mod.layer === WEBPACK_LAYERS.serverComponents &&
                         mod?.buildInfo?.rsc?.type !== 'client'
                       ) {
                         chunksHashServerLayer.add(hash)
@@ -1168,7 +1168,7 @@ export default class HotReloaderWebpack implements NextJsHotReloaderInterface {
                       )
 
                       if (
-                        mod.layer === WEBPACK_LAYERS.reactServerComponents &&
+                        mod.layer === WEBPACK_LAYERS.serverComponents &&
                         mod?.buildInfo?.rsc?.type !== 'client'
                       ) {
                         chunksHashServerLayer.add(hash)
@@ -1202,7 +1202,7 @@ export default class HotReloaderWebpack implements NextJsHotReloaderInterface {
 
                   if (serverComponentChangedItems) {
                     const serverKey =
-                      WEBPACK_LAYERS.reactServerComponents + ':' + key
+                      WEBPACK_LAYERS.serverComponents + ':' + key
                     const prevServerHash = pageHashMap.get(serverKey)
                     const curServerHash = chunksHashServerLayer.toString()
                     if (prevServerHash && prevServerHash !== curServerHash) {
diff --git a/test/e2e/module-layer/node_modules/external-lib/index.js b/test/e2e/module-layer/node_modules/external-lib/index.js
new file mode 100644
index 0000000000000..1d91a505bf716
--- /dev/null
+++ b/test/e2e/module-layer/node_modules/external-lib/index.js
@@ -0,0 +1 @@
+exports.externalValue = 'exteral-value'
diff --git a/test/e2e/module-layer/node_modules/external-lib/package.json b/test/e2e/module-layer/node_modules/external-lib/package.json
new file mode 100644
index 0000000000000..1aa8764b1da0d
--- /dev/null
+++ b/test/e2e/module-layer/node_modules/external-lib/package.json
@@ -0,0 +1,3 @@
+{
+  "exports": "./index.js"
+}
diff --git a/test/e2e/module-layer/pages/api/mixed.js b/test/e2e/module-layer/pages/api/mixed.js
index d49398953e56a..89826d7bcbc6a 100644
--- a/test/e2e/module-layer/pages/api/mixed.js
+++ b/test/e2e/module-layer/pages/api/mixed.js
@@ -1,5 +1,11 @@
-import '../../lib/mixed-lib'
+// import '../../lib/mixed-lib'
+import { externalValue } from 'external-lib'
+
+import React from 'react'
 
 export default function handler(req, res) {
-  return res.send('pages/api/mixed.js:')
+  if (Object(React).useState) {
+    throw new Error('React.useState should not be available')
+  }
+  return res.send('pages/api/mixed.js:' + externalValue)
 }