DDEV + Bedrock + Understrap - Browser Sync Proxy URL

[dekkydog]

Hi everyone, I using DDEV + Bedrock + Understrap-child theme. I'll be honest I'm pretty new to both DDEV and Bedrock but I'm very familiar with Understrap. I have a basic implementation of this setup working nicely except for the Browsersync Proxy URL?

In browser-sync.config.js I use:
module.exports = { "proxy": "https://bedrocktest.ddev.site", "notify": true, "files": ["./css/*.min.css", "./js/*.min.js", "./**/*.php"] };

The above proxy URL does work and serves up the site at https://localhost:3000 but with the following issues:

1. Invalid SSL cert showing in browser.
2. No live/hot reloading using npm run watch-bs

Q) Has anyone else used DDEV + Bedrock + Understrap? Can anyone point me in the right direction for the correct implementation of the proxy URL here? Any help or guidance appreciated :-)

[dekkydog]

In case anyone else encounters this issue with the above setup - I finally solved it and was pretty simple (once you know how).

1] To fix the invalid SSL. In your browser-sync.config.js:

module.exports = { "proxy": "https://bedrocktest.ddev.site", "notify": true, "https": { key: "your/path/to/ddev/bedrocktest/.ddev/traefik/certs/bedrocktest.key", cert: "your/path/to/ddev/bedrocktest/.ddev/traefik/certs/bedrocktest.crt" }, "files": ["./css/*.min.css", "./js/*.min.js", "./**/*.php"] };

2] If you do not see the live/hot reloading from npm run watch-bs then you likely have "development" set in your Bedrock .env file which has Config::define('WP_DEBUG', true);. This will mean that your understrap-child theme will never use the unminified file versions from this watch task. (Had me stumped for a while!)