# BrowserSync does not inject styles on external url

**URL:** https://discourse.roots.io/t/browsersync-does-not-inject-styles-on-external-url/12058
**Category:** sage
**Tags:** sage9
**Created:** 2018-03-28T16:34:20Z
**Posts:** 6
**Showing post:** 3 of 6

## Post 3 by @knowler — 2018-04-27T19:42:43Z

In Sage 9, Browsersync isn’t injecting the styles or scripts, Webpack’s [hot module replacement](https://webpack.js.org/concepts/hot-module-replacement/) (HMR) is handling that.

~~Can you provide us with any output from the browser console?~~

```
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://localhost:3000/app/themes/sage/dist/1d92b23a1590dc7df7ee.hot-update.json. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing).
Error: Manifest request to http://localhost:3000/app/themes/sage/dist/1d92b23a1590dc7df7ee.hot-update.json timed out.
[HMR] Update check failed: hotDownloadManifest/</request.onreadystatechange@http://192.168.0.13:3000/app/themes/sage/dist/scripts/main.js:40:22
```

It seems like the HMR client is unaware of the external URL as it is still calling for `localhost:3000`.

Related: [roots/sage#1874](https://github.com/roots/sage/issues/1874), [#1902](https://github.com/roots/sage/pull/1902)

This is based on @QWp6t’s advice in the closed PR above (#1902):

Create the file `resources/assets/config-local.json`. This file will be ignored by Git.

Replace the following address with whatever IP Browsersync is using for external URL.

```
{
  "proxyUrl": "http://192.168.x.x:3000"
}
```

This will make the Browsersync external URL work for HMR, but now `localhost:3000` will not.

* * *

Sidenote:

> [@Jan_Durkaj](#):
>
> domain-substituted.local

You might want to avoid using `.local` for your development TLD. If you are on a Mac, there could be a conflict with Bonjour which uses `.local`.

---

_[View the full topic](https://discourse.roots.io/t/browsersync-does-not-inject-styles-on-external-url/12058)._
