[ERR_HTTP_HEADERS_SENT] with yarn bud dev

Running Sage 10 with the latest and greatest of all the Sage tools on a new project.

When running yarn bud dev it starts my session:

 server url:    http://localhost:3000/         
 proxy url:     http://trellis.project.build/   

[99%] [cache] begin idle

Then sometimes after saving changes I will see the error below about set headers.

 server url:    http://localhost:3000/         
 proxy url:     http://trellis.project.build/   


[99%] [cache] begin idle
Error [ERR_HTTP_HEADERS_SENT]: Cannot set headers after they are sent to the client

Any saves I make after this will refresh the browser but won’t update/ inject any changes.
Instead, if I run yarn bud build from a different terminal and manually refresh the page, all styles are missing and everything is broken until I exit out of yarn bud dev and rerun that command, then refresh again. Shortly after, the set headers error appears again and the process starts over.

The only way for me to see my changes as I work is to run my proxy URL and refresh manually constantly. Even then, on manually refreshes, the changes don’t appear until after several quick hard refresh attempts.

Of course I’ve searched the discourse for related issues but can’t come up with anything recent that is similar to this one. Any ideas what could be causing the hurdle for me?

1 Like

Hi,

Same for me here. Happens just after setting up a new fresh install of Sage, using Local app for running my WP install. Can’t login to my wp-admin, the page refresh just after entering login/password. and the console after running yarn dev echo ‘[ERR_HTTP_HEADERS_SENT]: Cannot set headers after they are sent to the client’ multiple times

Sage latest version, same for Acorn.
PHP 8.0, using Apache and node v16, bud 5.7.6 and webpack 5.70.0

Any help would be appreciated,
Thanks

2 Likes

Just reverted to sage 10.0.0 for the moment, until this is fixed.

2 Likes

I have this often too (when running yarn dev). It as a bit annoying, but it doesn’t break anything afaik.
I wouldn’t focus too much on that error

1 Like

It’s nice to know I am not the only one with this problem. It’s hard for me NOT to focus on it since it roadblocks my development process by constantly needing to restart yarn bud dev or manually refresh the dev url in my browser to see changes.

Same here !
It happened for no reason.
Digging…

1 Like

Just saying that I get this error, but yarn dev is working fine for me. So there may be something else that is the cause of your problems

Others are having it too:

Was debugging this issue in another discourse thread and found this issue linked to the http-proxy-middleware lib wherein is a possible solution. Not sure if related, but I did notice that it could have something to do with how Bud is calling createProxyMiddleware.

We have the same problem. We noticed that this problem is only present when the slash at the end of the URL is missing.
Maybe it is related to the resolution of this issue? [bug] localhost:3000 is redirected if slash is missing at the end of the URL · Issue #1210 · roots/bud · GitHub

That doesn’t help for me. I have to rebuild and hard refresh almost everytime I make a change.

1 Like

This notice should no longer be present in 5.8.x :crossed_fingers:t4:.

@joshb Your issue, whatever it is, is almost 100% unrelated to this debug notice. Hopefully bud@5.8.x fixes it for you. If not, I’m happy to look at a reproduction repository to debug.

Yesterday I started a new project with the latest sage 10 and am still experiencing the same issues as the other project I had first encountered these issues with. However this time I am not seeing the HEADERS_SENT issue.

I did a quick video / audio capture showing the problems I am having.

At this point I don’t know what to do to get this past this other than heading back to sage 9 or attempting to reformat my mac / upgrade, reinstall everything, etc… I would love not to do that if anyone has any idea why this is happening with my projects.

1 Like

I definitely need this available as a repo in order to help you debug it.

I am still experiencing issues with this and have found no solutions.

Currently I am working on a project where I run yarn dev :

mode    development    hash       4d22805138a4cebaf209   
 bud     6.6.9          webpack    5.70.0                 

 server url:    http://localhost:3000/                         
 proxy url:     http://trellis.project.build/   


[99%] [cache] begin idle

I then open the server url and css and js is broken.
The console errors:

Refused to apply style from 'http://localhost:3000/app.abef91.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.

jquery-migrate.js?ver=3.3.2:69 JQMIGRATE: Migrate is installed with logging active, version 3.3.2
localhost/:1 

Refused to execute script from 'http://localhost:3000/app.f5abda.js' because its MIME type ('text/html') is not executable, and strict MIME type checking is enabled.

Viewing by the proxy url, everything is fine… until I make a single save. When I refresh, everything is broken again until I run yarn build and refresh.

When I have been working on this project here and there over the last couple of weeks, I just make my changes and refresh manually when ready to view them and when I need to compile css and js, I just run the command manually and view them.

And after a while of sitting, this error will just randomly appear in the terminal:

[99%] [cache] begin idle
Error [ERR_HTTP_HEADERS_SENT]: Cannot set headers after they are sent to the client
Error [ERR_HTTP_HEADERS_SENT]: Cannot set headers after they are sent to the client

Would love to figure what is causing this if anyone has any clue.

Again, you must provide some sort of reproduction in order for anybody to effectively help you.