docs: add more details about nextRuntime in webpack config and runtim…

…e in next config (#36862)

## Documentation / Examples

- [x] Make sure the linting passes by running `yarn lint`

docs/advanced-features/react-18/switchable-runtime.md

@@ -2,6 +2,8 @@
 
 By default, Next.js uses Node.js as the runtime for page rendering, including pre-rendering and server-side rendering.
 
+> Note: `runtime` option only effects pages but not middleware
+
 If you have [React 18](/docs/advanced-features/react-18/overview) installed, there is a new experimental feature that lets you switch the page runtime between Node.js and the [Edge Runtime](/docs/api-reference/edge-runtime). Changing the runtime affects [SSR streaming](/docs/advanced-features/react-18/streaming) and [Server Components](/docs/advanced-features/react-18/server-components) features, as well.
 
 ## Global Runtime Option

docs/api-reference/next.config.js/custom-webpack-config.md

@@ -4,6 +4,8 @@ description: Extend the default webpack config added by Next.js.
 
 # Custom Webpack Config
 
+> Note: changes to webpack config are not covered by semver so proceed at your own risk
+
 Before continuing to add custom webpack configuration to your application make sure Next.js doesn't already support your use-case:
 
 - [CSS imports](/docs/basic-features/built-in-css-support.md#adding-a-global-stylesheet)
@@ -22,7 +24,10 @@ In order to extend our usage of `webpack`, you can define a function that extend
 
 ```js
 module.exports = {
-  webpack: (config, { buildId, dev, isServer, defaultLoaders, webpack }) => {
+  webpack: (
+    config,
+    { buildId, dev, isServer, defaultLoaders, nextRuntime, webpack }
+  ) => {
     // Important: return the modified config
     return config
   },
@@ -36,7 +41,7 @@ The second argument to the `webpack` function is an object with the following pr
 - `buildId`: `String` - The build id, used as a unique identifier between builds
 - `dev`: `Boolean` - Indicates if the compilation will be done in development
 - `isServer`: `Boolean` - It's `true` for server-side compilation, and `false` for client-side compilation
-- `nextRuntime`: `String` - The target runtime for server-side compilation; either `"edge"` or `"nodejs"`
+- `nextRuntime`: `String | undefined` - The target runtime for server-side compilation; either `"edge"` or `"nodejs"`, it's `undefined` for client-side compilation.
 - `defaultLoaders`: `Object` - Default loaders used internally by Next.js:
   - `babel`: `Object` - Default `babel-loader` configuration
 
@@ -64,6 +69,10 @@ module.exports = {
 }
 ```
 
+#### `nextRuntime`
+
+Notice that `isServer` is `true` when `nextRuntime` is `"edge"` or `"nodejs"`, nextRuntime "`edge`" is currently for middleware and server components in edge runtime only.
+
 ## Related
 
 <div class="card">