# Bedrock + Sage 9 + Docker. Webpack / Browsersync doesn't catch file changes

**URL:** https://discourse.roots.io/t/bedrock-sage-9-docker-webpack-browsersync-doesnt-catch-file-changes/9063
**Category:** sage
**Tags:** sage9, browsersync, webpack
**Created:** 2017-03-12T19:26:02Z
**Posts:** 7

## Post 1 by @jordan-enev — 2017-03-12T19:26:02Z

Hello everyone!

Here is my tech stack:

1. Bedrock + Sage 9.0.0-beta.2.
2. Docker Toolbox for Windows:  
2.1 Docker compose handles PHP & Nginx & MySQL & Composer installs.  
2.2 The following Docker image `blacha/docker-yarn-webpack` handles all yarn’s scripts.

Everything works perfect, except the yarn start script:

> `webpack --hide-modules --watch --config assets/build/webpack.config.js`

**When I change a .scss (or any other file) nothing happens. That’s the problem.**

I run the start script as follow:

> `# Compile assets when file changes are made, start Browsersync session docker run --network puzzles_wpnet -p 3000:3000 -p 3001:3001 --rm -v ${PuzzlesRootPath}/web/app/themes/sage-commerce:/workspace/ -w /workspace/ blacha/docker-yarn-webpack yarn run start --no-bin-links`

Here is the response:

```
yarn run v0.18.1
$ webpack --hide-modules --watch --config assets/build/webpack.config.js

Webpack is watching the files…

[BS] [HTML Injector] Running...
[BS] Proxying: http://192.168.99.100:81
[BS] Access URLs:
 ---------------------------------------
       Local: http://localhost:3000
    External: http://192.168.99.100:3000
 ---------------------------------------
          UI: http://localhost:3001
 UI External: http://192.168.99.100:3001
 ---------------------------------------
[BS] Watching files...
[BS] Couldn't open browser (if you are using BrowserSync in a headless environment, you might want to set the open option to false)
```

* * *

Here are my **Docker compose** and **Sage config** files.

- _Keep in mind that Docker runs in VM, once Docker Toolbox is used. The IP of VM i `192.168.99.100`._

**docker-compose.yml** :

```
version: '2'
services:
  nginx:
    image: hoangstark/bedrock-nginx:latest
    ports:
     - "81:80"
    volumes:
     - .:/usr/share/nginx/html
    networks:
     - wpnet
  php:
    image: hoangstark/bedrock-php:latest
    volumes:
     - .:/usr/share/nginx/html
    networks:
     - wpnet
  mysql:
    image: mysql:5.7
    ports:
     - "3306:3306"
    environment:
      MYSQL_ROOT_PASSWORD: secret
      MYSQL_DATABASE: wordpress
      MYSQL_USER: wordpress
      MYSQL_PASSWORD: secret
    volumes:
     - ./web/app/uploads/docker-mysqldb:/var/lib/mysql
    networks:
     - wpnet
  composer:
     image: composer/composer
     volumes_from:
      - php
     working_dir: /usr/share/nginx/html
  yarn_webpack:
    image: blacha/docker-yarn-webpack
networks:
  wpnet:
    driver: "bridge"
volumes:
  data:
    driver: "local"
```

**sage/assets/config.json** :

```
{
  "entry": {
    "main": [
      "./scripts/main.js",
      "./styles/main.scss"
    ],
    "customizer": [
      "./scripts/customizer.js"
    ]
  },
  "watch": [
    "templates/**/*.php",
    "src/**/*.php",
  ],
  "publicPath": "/app/themes/sage-commerce",
  "devUrl": "http://192.168.99.100:81",
  "proxyUrl": "http://192.168.99.100:3000",
  "cacheBusting": "[name]_[hash:8]",
  "browsers": [
    "last 2 versions",
    "android 4",
    "opera 12"
  ]
}
```

* * *

**Here are the available IP addresses:**

- 192.168.99.100:81 - Here I access my Wordpress app with production build.
- 192.168.99.100:3000 - Here I access it too, once I run the `yarn start` script. Webpack and Browsersync are connected.
- 192.168.99.100:3001 - Browsersync admin panel.

---

## Post 2 by @jordan-enev — 2017-03-14T19:09:21Z

I switched to Docker for Windows, because of to eliminate the VM. However it doesn’t work again.  
So I run locally (without Docker, on my host machine) `yarn start` and it works correctly.

Therefore the problem is somewhere between the Docker and my host machine (not the Sage theme).

Any help is appreciated. Thanks!

---

## Post 3 by @falc0nline1 — 2018-10-16T13:41:46Z

Hello, I have the same problem. Did you solved them?

---

## Post 4 by @jordan-enev — 2018-10-16T13:58:54Z

Unfortunately not. Still running it on my local host and stop using the Docker.

BTW I had the same issue with React && Docker and found out a fix. You can try to apply it for this case: [https://stackoverflow.com/a/43065210/4312466](https://stackoverflow.com/a/43065210/4312466)

---

## Post 5 by @falc0nline1 — 2018-10-16T15:08:17Z

I found solution.

I have just set `sendfile off;` in my docker nginx conf file.

---

## Post 6 by @kalenjohnson — 2018-10-16T19:25:08Z

Have you guys tried watch-poll? That seems to work for me using webpack on Windows

---

## Post 7 by @falc0nline1 — 2018-11-09T15:20:26Z

> [@kalenjohnson](#):
>
> watch-poll

Sorry, missed your message. Thanks for providing additional info.  
I develop on macOS. Anyway, I found a solution:

1. nginx `sendfile off;`
2. `devServer: { watchOptions: { poll: true, }, },`

> [@BrowserSync Not Watching Changes in Docker for Windows](https://discourse.roots.io/t/browsersync-not-watching-changes-in-docker-for-windows/11275):
>
> Hello, This issue is in regards to sage 9.0.0-beta.4 and Docker for Windows. Up to this point I’ve been using Sage 9 inside Docker for Mac containers and it’s been running well. I’m looking to expand its usage to a few of my team members and in doing so I’ve begun testing different environments, specifically Docker for Windows. File changes are not seen or compiled in Docker for Windows unless they originate from within the container. This suggests a polling issue. I initially added polling …