From a75b32387741088a808b0e1c0f06040489fd3a86 Mon Sep 17 00:00:00 2001
From: Shu Ding <g@shud.in>
Date: Mon, 17 Oct 2022 15:48:52 +0200
Subject: [PATCH] Include frameworks in main-app (#41465)

There is no need to have a separate `framework` chunk for React and React DOM, as they're already included in the `main-app` entry. With this PR, React and React DOM will be included in `main-app` directly and app is no longer depending on the `framework` chunk.

## Bug

- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
- [ ] Errors have a helpful link attached, see `contributing.md`

## 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`
- [ ] Integration 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`

## Documentation / Examples

- [ ] Make sure the linting passes by running `pnpm lint`
- [ ] The "examples guidelines" are followed from [our contributing doc](https://github.com/vercel/next.js/blob/canary/contributing/examples/adding-examples.md)
---
 packages/next/build/webpack-config.ts | 19 +++++++++++++++++--
 1 file changed, 17 insertions(+), 2 deletions(-)

diff --git a/packages/next/build/webpack-config.ts b/packages/next/build/webpack-config.ts
index 9ada810582674..ca0cf84f8f13c 100644
--- a/packages/next/build/webpack-config.ts
+++ b/packages/next/build/webpack-config.ts
@@ -1338,10 +1338,25 @@ export default async function getBaseWebpackConfig(
           // and all other chunk depend on them so there is no
           // duplication that need to be pulled out.
           chunks: (chunk: any) =>
-            !/^(polyfills|main|pages\/_app)$/.test(chunk.name),
+            !/^(polyfills|main|main-app|pages\/_app)$/.test(chunk.name),
           cacheGroups: {
             framework: {
-              chunks: 'all',
+              chunks: (chunk) => {
+                const name = chunk.name
+
+                // Skip app directory and include shared modules in main-app.
+                if (
+                  name &&
+                  hasAppDir &&
+                  (name === 'main-app' ||
+                    name === 'app-internals' ||
+                    name.startsWith('app/'))
+                ) {
+                  return false
+                }
+
+                return true
+              },
               name: 'framework',
               test(module: any) {
                 const resource = module.nameForCondition?.()