# Webpack sync is not working

**URL:** https://discourse.roots.io/t/webpack-sync-is-not-working/13508
**Category:** sage
**Tags:** webpack, sage9
**Created:** 2018-09-01T09:38:54Z
**Posts:** 7

## Post 1 by @prium — 2018-09-01T09:38:54Z

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](https://discourse.roots.io/uploads/default/original/2X/a/ab6ec68e4ef628f940f0a81f22ed63541f30b1ff.png)

---

## Post 2 by @strarsis — 2018-09-01T13:18:09Z

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

---

## Post 3 by @prium — 2018-09-02T05:29:21Z

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.

---

## Post 4 by @strarsis — 2018-09-02T12:35:48Z

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](https://discourse.roots.io/t/sage-9-browsersync-not-loading-any-css-at-all-on-yarn-run-start/11332/26?u=strarsis).  
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.

---

## Post 5 by @knowler — 2018-09-03T01:31:49Z

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

```
...
"publicPath": "/app/themes/orangesmith",
...
```

---

## Post 6 by @josialoos — 2019-08-16T10:16:02Z

I have the exact same Issue, this is my config.json:

 ![08](https://discourse.roots.io/uploads/default/original/2X/d/d3d390888392ebbf31a8aa4be0d6df7538f1b61e.png)

I changed the name of my themefolder from “Roots Paradisepress” to “rootsparadisepress”, because I had an issue with the space in the directory name in wp-cli, when switching themes.

my `publicPath` originally was:  
`"publicPath": "\"/app/themes/Roots Paradisepress\"",`

→ don’t understand the slash at the beginning of the path and the double quotation marks? Never seen anything like this …

Changing the path to `"publicPath": "/app/themes/rootsparadisepress"` didn’t fix the issue.

When I run `yarn start`, it opens the url `localhost:3002`, which is strange, because in `config.json` it says `localhost:3000`. Everything is loaded fine so far. When saving \_global.scss, the browser window reloads, but does not show any changes made (also not in chrome dev tools).

This happens on a fresh installed Sage-Theme with bedrock and trellis.

---

## Post 7 by @josialoos — 2019-08-16T12:44:07Z

I solved my problem as described here:

> [@Browsersync not noticing php files](https://discourse.roots.io/t/browsersync-not-noticing-php-files/16368/3):
>
> This solved the problem for me: For everyone having these or similar issues with browsersync and/or yarn not building/syncing Scss and Php Files, I would recommend this troubleshooting guide by @knowler: Thanks a lot to @ben and @knowler!

→ Check out the links in that post!
