Repository: next.js
Issue: ChunkLoadError: Loading chunk app/layout failed. (timeout: http://localhost:3000/_next/static/chunks/app/layout.js)
Labels: bug,Webpack

### Link to the code that reproduces this issue

https://github.com/Intellyse/next-js-bug

### To Reproduce

1. clone project
2. npm install
3. npm run dev
4. open the page and you can see chrome console output: Uncaught SyntaxError: Invalid or unexpected token
5. same minutes you can see error:Uncaught ChunkLoadError: Loading chunk app/layout failed.
![image](https://github.com/vercel/next.js/assets/150797609/44dd92a7-8502-4889-8cdd-17348caadf23)


### Current vs. Expected behavior

1. First time open the page is error but you refresh page is work!
2. I expected is work all the time

### Provide environment information

```bash
Operating System:
  Platform: wls ubutnu
  Arch: arm64
  Version: wls version 2
Binaries:
  Node: 20.9.0
  npm: 10.1.0
Relevant Packages:
  next: 14.2.3 // I tried also last canary version (15.0.0-canary.10).
  eslint-config-next: 14.2.3
  react: 18.2.0
  react-dom: 18.0.0
  typescript: 5.4.5
Next.js Config:
  output: N/A
```


### Which area(s) are affected? (Select all that apply)

Webpack

### Which stage(s) are affected? (Select all that apply)

next dev (local)

### Additional context

The error seems happen randomly, and we have this issue also in production. It seems related with something with webpack

```
__webpack_require__.f.j = function (chunkId, promises) {
  // JSONP chunk loading for javascript
  var installedChunkData = __webpack_require__.o(installedChunks, chunkId)
    ? installedChunks[chunkId]
    : undefined;
  if (installedChunkData !== 0) {
    // 0 means "already installed".

    // a Promise means "currently loading".
    if (installedChunkData) {
      promises.push(installedChunkData[2]);
    } else {
      if ("webpack" != chunkId) {
        // setup Promise in chunk cache
        var promise = new Promise(function (resolve, reject) {
          installedChunkData = installedChunks[chunkId] = [resolve, reject];
        });
        promises.push((installedChunkData[2] = promise));

        // start chunk loading
        var url = __webpack_require__.p + __webpack_require__.u(chunkId);
        // create error before stack unwound to get useful stacktrace later
        var error = new Error();
        var loadingEnded = function (event) {
          if (__webpack_require__.o(installedChunks, chunkId)) {
            installedChunkData = installedChunks[chunkId];
            if (installedChunkData !== 0) installedChunks[chunkId] = undefined;
            if (installedChunkData) {
              var errorType = event && (event.type === "load" ? "missing" : event.type);
              var realSrc = event && event.target && event.target.src;
              error.message =
                "Loading chunk " + chunkId + " failed.\n(" + errorType + ": " + realSrc + ")";
              error.name = "ChunkLoadError";
              error.type = errorType;
              error.request = realSrc;
              installedChunkData[1](error);
            }
          }
        };
        __webpack_require__.l(url, loadingEnded, "chunk-" + chunkId, chunkId);
      } else installedChunks[chunkId] = 0;
    }
  }
};

```
the error rise at line: var error = new Error();