Let´s say you have a file structure like this:

build
-script
--default.min.js
-styles
--default.min.css
js
-default.js
sass
_head.scss
_body.scss
_footer.scss
default.css

On every scss change grunt (should work with gulp as well) will generate a new default.min.css file in your build/styles folder without reloading the browser in connection the old file is updated or replaced. The trick is, that browsersync doesn´t trigger on css but on scss file extensions. So the only thing you have to do is to generate the default.min.css twice for example as default-reload.scss inside the build/styles folder and browsersync will trigger at the right time.

So if you are using the grunt-contrib-cssmin plugin add another task like this:

cssmin: {
...

default: {

files: {

'build/styles/default.min.css': 'sass/default.css'

},

},
/*only needed for browserSynctrigger*/
syncTrigger: {

files: {

'build/styles/default-reload.scss': 'sass/default.css'

},

},

},