Browsersync is only refreshing the changes made to main.css - and not my additional stylesheets

I have added a new stylesheet to my theme and it is getting built to dist and enqueued to wordpress correctly.

However, when I “yarn start” browsersync is only refreshing CORRECTLY when I make changes to the the main.css file, and not when my additional.css file sass is changed.

When I make changes to the additional.css sass I do get a webpack rebuilt notification, but the changes are not reflected on the page.

Is there something I am missing? Maybe something in the webpack config?

I am working on a remote server in a staging environment if this helps.



This is not compatible with trying to run the build task meant specifically for local development environments

Thanks @ben. I thought this might be the case.

The browsersync injections work for main.css, so I will combine the stylesheets for now and separate them out later.