Is it possible to "watch" without browsersync?

sage
,
1

Is there a way to disable browsersync while still leveraging the watch task for compiling assets? Browsersync has been causing me a lot of grief lately, and I’d rather just call a watch task to build the assets rather than inject them.

I’ve used webpack quite a bit, but I’m not very familiar with modifying it… Can somebody point me in the right direction?

2

Why not just leave everything as is and just use your development url? You’ll have to manually refresh obviously. I do this often because browsersync can really annoy me in some circumstances.

3

Yeah I tried that, but it seems like I often need to call a yarn build in order to see some of my changes… Which gets tiresome.

It’s almost as if the more times watch fires, the less likely my dev url will display the site accurately.

EDIT: I think the main problem I’m having with this method is the scss changes not being visible, as per my comment below. Changes to the blade files seem to work fine.

4

Well, one thing that wouldn’t work with the traditional watch would be styles in Gutenberg editor as these are downloaded via HTTP (though it should be fast as it connects to localhost) at the servers-side and then parsed, prefixed/transformed (body to .editor-styles-wrapper) and injected by the editor JavaScript. As Gutenberg editor is based on React, the new Sage 10 could try to implement React Hot Reloading for the theme styles in editor?

5

Also any changes to any of the themes scss files aren’t visible outside of the livereload url… Is there at least a way to do a hard compile of these in the watch task, rather than injecting them?

6

Updates on frontend should still just work automatically. Check the Console in your browser, this may be caused by a JavaScript issue within Browser Sync.

7

Hi @shaneparsons

Here’s a quick and dirty way to disable BrowserSync and Webpack HMR in Sage 9 :

It essentially makes yarn start behave like what I would expect from yarn watch.

I’ve used this configuration on a few projects with Turbolinks on the front-end, which works very well.

I hope it can be useful,

P.

3 Likes
8

Thanks man, I’ll check this out next time I’m at my desk!

9

Thanks man, it works great!

10

Perfect, thanks for the feedback!

I cleaned it up and sent a pull request this morning :

2 Likes
11

Thanks for this guys. Browsersync sucks!

2 Likes