Roots Discourse

Webpack sync is not working

sage9
#1

I’ve freshly installed everything (Trellis, Bedrock, Sage). When I run yarn run start all SCSS compiles and everything works fine. But when I change any of the SCSS files, the update doesn’t sync and show up in the browser. However, when I create an error in SCSS, it does show me the black overlay with some error message. And if I run yarn run start again, it does show me the updated styles. Please help.

My config.json
18%20PM

0 Likes

#2

Have you checked the browser console (Developer Tools in Chrome, F12 shortkey) at
load of page and when triggering a asset rebuild/reload?

1 Like

#3

Hey @strarsis! Thank you for the response.
Yes, it rebuilds, it even shows a little notification with black background in the upper right corner saying Webpack build<hash> xxxms when I hit save in the editor. And also DONE Compiled successfully in 3383ms in my terminal. When I go to http://localhost:3001/ the browser sync setting are loading nicely. Can’t see any error anywhere! Just not “reloading” the new styles.

0 Likes

#4
  1. Are you using new styles that are visible or are you inspecting the selected elements?
    Maybe these styles are applied indeed but simply not visible.
  2. I encountered an issue with similar symptoms, it could be a CORS issue with browser sync.
    Edit: I notice that you added something related to your browser sync config, the cors option mentioned in the discussion I linked to above may do more than adding this particular header.
0 Likes

#5

A forward slash is missing from the start of your publicPath. It should read:

...
"publicPath": "/app/themes/orangesmith",
...
2 Likes