webpack / webpack-dev-middleware

A development middleware for webpack
MIT License
2.49k stars 376 forks source link

Regression from 7.2.1 to 7.3.0 #1920

Closed zwarag closed 3 weeks ago

zwarag commented 4 weeks ago

Hello webpack Team. I believe there is a regression between 7.2.1 and 7.3.0.

Bug report

In our angular project we use webpack builder. This has a dependency to webpack-dev-middleware. When setting up a project that uses 7.3.0, an error is thrown as seen below.

NOTE: The setup is just a default setup, but we still use webpack instead of esbuild.

Actual Behavior

An error is thrown after starting the project. The interesting thing is that our projects do not have SSR enabled in any way. So what webpack does is to just behave as a file server.

There seems to be other users affected by this: https://stackoverflow.com/questions/78777506/angular-18-post-request-node-http-outgoing659-throw-new-err-http-headers-sen

Expected Behavior

No regression, 7.3.0 should work like 7.2.1.

How Do We Reproduce?

I'm sorry, I'm not able to provide an minimal reproducable example.

Please paste the results of npx webpack-cli info here, and mention other relevant information

webpack info:

❯ npx webpack-cli info
Need to install the following packages:
webpack-cli@5.1.4
Ok to proceed? (y)

  System:
    OS: macOS 14.5
    CPU: (8) arm64 Apple M1 Pro
    Memory: 1.40 GB / 32.00 GB
  Binaries:
    Node: 22.5.1 - ~/.local/state/fnm_multishells/769_1723553164937/bin/node
    Yarn: 1.22.22 - ~/.local/state/fnm_multishells/769_1723553164937/bin/yarn
    npm: 10.8.2 - ~/.local/state/fnm_multishells/769_1723553164937/bin/npm
  Browsers:
    Brave Browser: 127.1.68.137
    Chrome: 127.0.6533.119
    Edge: 127.0.2651.98
    Safari: 17.5

Error:

~/repos/thomas  master [!] +12                                                                                 󰚲 ^18.1.3  v22.5.1 3s  08:39:02
❯ yarn start
yarn run v1.22.22
$ ng serve
✅ Extracted following Data: {"className":"Thomas","type":"application","name":"thomas","version":"0.0.0","prefix":"app","buildTime":"14.8.2024, 08:39:04","releaseVersion":"","rdsNgVersion":"^18.0.0"}
✅ No standalone application detected!
✅ Template File read
⌛ Compiling Template
✏️ writing file
✅ MetaData Service created at:  /Users/harryskavan/repos/thomas//src/app/gen/meta-data/thomas-meta-data.service.ts
✔ Browser application bundle generation complete.

Initial chunk files   | Names                                                              |  Raw size
main.js               | main                                                               |   6.97 MB |
styles.css, styles.js | styles                                                             | 750.96 kB |
polyfills.js          | polyfills                                                          | 348.59 kB |
runtime.js            | runtime                                                            |  14.45 kB |

                      | Initial total                                                      |   8.08 MB

Lazy chunk files      | Names                                                              |  Raw size
581.js                | sweetalert2                                                        | 173.58 kB |
379.js                | rds-ng-template-smart-dom-mutation-observer-presenter-BMVse34q-mjs |  12.90 kB |

Build at: 2024-08-14T06:39:08.364Z - Hash: a594e7634292f9e5 - Time: 3472ms

** Angular Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **

✔ Compiled successfully.
✔ Browser application bundle generation complete.

Initial chunk files | Names   | Raw size
runtime.js          | runtime | 14.45 kB |

5 unchanged chunks

Build at: 2024-08-14T06:39:08.852Z - Hash: 0dbbbd76ef220eef - Time: 349ms

✔ Compiled successfully.
node:_http_outgoing:699
    throw new ERR_HTTP_HEADERS_SENT('set');
          ^

Error [ERR_HTTP_HEADERS_SENT]: Cannot set headers after they are sent to the client
    at ServerResponse.setHeader (node:_http_outgoing:699:11)
    at setResponseHeader (/Users/harryskavan/repos/thomas/node_modules/webpack-dev-server/node_modules/webpack-dev-middleware/dist/utils/compatibleAPI.js:120:14)
    at processRequest (/Users/harryskavan/repos/thomas/node_modules/webpack-dev-server/node_modules/webpack-dev-middleware/dist/middleware.js:599:7)
    at ready (/Users/harryskavan/repos/thomas/node_modules/webpack-dev-server/node_modules/webpack-dev-middleware/dist/utils/ready.js:16:5)
    at middleware (/Users/harryskavan/repos/thomas/node_modules/webpack-dev-server/node_modules/webpack-dev-middleware/dist/middleware.js:640:5)
    at Layer.handle [as handle_request] (/Users/harryskavan/repos/thomas/node_modules/express/lib/router/layer.js:95:5)
    at trim_prefix (/Users/harryskavan/repos/thomas/node_modules/express/lib/router/index.js:328:13)
    at /Users/harryskavan/repos/thomas/node_modules/express/lib/router/index.js:286:9
    at Function.process_params (/Users/harryskavan/repos/thomas/node_modules/express/lib/router/index.js:346:12)
    at next (/Users/harryskavan/repos/thomas/node_modules/express/lib/router/index.js:280:10)
    at /Users/harryskavan/repos/thomas/node_modules/connect-history-api-fallback/lib/index.js:34:14
    at Layer.handle [as handle_request] (/Users/harryskavan/repos/thomas/node_modules/express/lib/router/layer.js:95:5)
    at trim_prefix (/Users/harryskavan/repos/thomas/node_modules/express/lib/router/index.js:328:13)
    at /Users/harryskavan/repos/thomas/node_modules/express/lib/router/index.js:286:9
    at Function.process_params (/Users/harryskavan/repos/thomas/node_modules/express/lib/router/index.js:346:12)
    at next (/Users/harryskavan/repos/thomas/node_modules/express/lib/router/index.js:280:10)
    at goNext (/Users/harryskavan/repos/thomas/node_modules/webpack-dev-server/node_modules/webpack-dev-middleware/dist/middleware.js:133:16)
    at processRequest (/Users/harryskavan/repos/thomas/node_modules/webpack-dev-server/node_modules/webpack-dev-middleware/dist/middleware.js:605:15)
    at ready (/Users/harryskavan/repos/thomas/node_modules/webpack-dev-server/node_modules/webpack-dev-middleware/dist/utils/ready.js:16:5)
    at middleware (/Users/harryskavan/repos/thomas/node_modules/webpack-dev-server/node_modules/webpack-dev-middleware/dist/middleware.js:640:5)
    at Layer.handle [as handle_request] (/Users/harryskavan/repos/thomas/node_modules/express/lib/router/layer.js:95:5)
    at trim_prefix (/Users/harryskavan/repos/thomas/node_modules/express/lib/router/index.js:328:13)
    at /Users/harryskavan/repos/thomas/node_modules/express/lib/router/index.js:286:9
    at Function.process_params (/Users/harryskavan/repos/thomas/node_modules/express/lib/router/index.js:346:12)
    at next (/Users/harryskavan/repos/thomas/node_modules/express/lib/router/index.js:280:10)
    at Server.setHeaders (/Users/harryskavan/repos/thomas/node_modules/webpack-dev-server/lib/Server.js:2829:5)
    at Layer.handle [as handle_request] (/Users/harryskavan/repos/thomas/node_modules/express/lib/router/layer.js:95:5)
    at trim_prefix (/Users/harryskavan/repos/thomas/node_modules/express/lib/router/index.js:328:13)
    at /Users/harryskavan/repos/thomas/node_modules/express/lib/router/index.js:286:9
    at param (/Users/harryskavan/repos/thomas/node_modules/express/lib/router/index.js:365:14)
    at param (/Users/harryskavan/repos/thomas/node_modules/express/lib/router/index.js:376:14)
    at Function.process_params (/Users/harryskavan/repos/thomas/node_modules/express/lib/router/index.js:421:3)
    at next (/Users/harryskavan/repos/thomas/node_modules/express/lib/router/index.js:280:10)
    at next (/Users/harryskavan/repos/thomas/node_modules/express/lib/router/route.js:141:14)
    at next (/Users/harryskavan/repos/thomas/node_modules/express/lib/router/route.js:145:7)
    at next (/Users/harryskavan/repos/thomas/node_modules/express/lib/router/route.js:145:7)
    at next (/Users/harryskavan/repos/thomas/node_modules/express/lib/router/route.js:145:7)
    at next (/Users/harryskavan/repos/thomas/node_modules/express/lib/router/route.js:145:7)
    at next (/Users/harryskavan/repos/thomas/node_modules/express/lib/router/route.js:145:7)
    at next (/Users/harryskavan/repos/thomas/node_modules/express/lib/router/route.js:145:7)
    at next (/Users/harryskavan/repos/thomas/node_modules/express/lib/router/route.js:145:7)
    at next (/Users/harryskavan/repos/thomas/node_modules/express/lib/router/route.js:145:7)
    at next (/Users/harryskavan/repos/thomas/node_modules/express/lib/router/route.js:145:7)
    at next (/Users/harryskavan/repos/thomas/node_modules/express/lib/router/route.js:145:7)
    at next (/Users/harryskavan/repos/thomas/node_modules/express/lib/router/route.js:145:7)
    at next (/Users/harryskavan/repos/thomas/node_modules/express/lib/router/route.js:145:7)
    at next (/Users/harryskavan/repos/thomas/node_modules/express/lib/router/route.js:145:7)
    at next (/Users/harryskavan/repos/thomas/node_modules/express/lib/router/route.js:145:7)
    at next (/Users/harryskavan/repos/thomas/node_modules/express/lib/router/route.js:145:7)
    at next (/Users/harryskavan/repos/thomas/node_modules/express/lib/router/route.js:145:7) {
  code: 'ERR_HTTP_HEADERS_SENT'
}

Node.js v22.5.1
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
alexander-akait commented 4 weeks ago

Sorry, I can't say there is a problem without reproduciable example and we always sent Content-Length header in such case - https://github.com/webpack/webpack-dev-middleware/blob/v7.2.1/src/middleware.js#L695 (based on your stacktrace), so I think the problem in another place and maybe not related to weback-dev-middleware

alexander-akait commented 4 weeks ago

Anyway if you can create a reproducible repo I will investigate

vieira commented 4 weeks ago

Hello, I am having the same issue in a React project, changing the version of webpack-dev-middleware from 7.3.0 to 7.2.1 in the lockfile "solves" the problem.

I also noticed that while it happens when NODE_ENV="production" it does not happen if NODE_ENV="development" in my case.

The devServer block in webpack.config.js:

  devServer: {
      open: true,
      allowedHosts: 'all',
      hot: true,
      compress: false,
      static: {
        directory: path.join(__dirname, 'src'),
      },
      devMiddleware: {
        stats: 'minimal',
      },
      client: {
        overlay: {
          errors: true,
          warnings: false,
        },
      },
      historyApiFallback: {
        rewrites: [{
          from: /^\/.*$/,
          to: '/',
        }],
      },
    }
alexander-akait commented 4 weeks ago

There are no problems with devServer, looks like something sent content early than we, without context it is hard to say who...

alexander-akait commented 3 weeks ago

/cc @alan-agius4 Maybe I can help with debug?

alan-agius4 commented 3 weeks ago

@alexander-akait, without a reproduction of the issue, it's difficult to understand what's going on. Unless a reproduction is provided, I’d say this is not actionable.

shanedg commented 3 weeks ago

I was running into this problem with start-server-and-test. I found this note in the README about webpack-dev-server not handling HEAD requests: https://github.com/bahmutov/start-server-and-test/blob/8ebb70b7b2be40b4b1b2f08d0b9c3ef51dfaca10/README.md#note-for-webpack-dev-server-users

Changing to GET requests per the note worked for me. I'm not sure why HEAD requests worked for me before (?) but it only became an issue when I was updating dependencies and webpack-dev-middleware was indirectly bumped from 7.2.1 to 7.3.1.

alexander-akait commented 3 weeks ago

That's weird, because we are doing it https://github.com/webpack/webpack-dev-middleware/blob/master/src/middleware.js#L800, can you debug it locally and provide more infromation?

shanedg commented 3 weeks ago

I have a minimal repro of the issue here: https://github.com/shanedg/webpack-dev-middleware-1920

alexander-akait commented 3 weeks ago

I will look soon, thank you

alexander-akait commented 3 weeks ago

Found a problem, fix will soon

alexander-akait commented 3 weeks ago

Fixed https://github.com/webpack/webpack-dev-middleware/releases/tag/v7.4.2

zwarag commented 3 weeks ago

Thank you @alexander-akait