Merge pull request #2527 from lbssousa/browsersync-ports

Added option to map Browsersync ports from workspace container

DOCUMENTATION/content/documentation/index.md

@@ -617,6 +617,31 @@ docker-compose up -d php-worker
 
 
 
+<br>
+<a name="Use-Browsersync-With-Laravel-Mix"></a>
+## Use Browsersync with Laravel Mix
+
+1. Add the following settings to your `webpack.mix.js` file. Please refer to Browsersync [Options](https://browsersync.io/docs/options) page for more options.
+```
+const mix = require('laravel-mix')
+
+(...)
+
+mix.browserSync({
+  open: false,
+  proxy: 'nginx' // replace with your web server container
+})
+```
+
+2. Run `npm run watch` within your `workspace` container.
+
+3. Open your browser and visit address `http://localhost:[WORKSPACE_BROWSERSYNC_HOST_PORT]`. It will refresh the page automatically whenever you edit any source file in your project.
+
+4. If you wish to access Browsersync UI for your project, visit address `http://localhost:[WORKSPACE_BROWSERSYNC_UI_HOST_PORT]`.
+
+
+
+
 <br>
 <a name="Use-Mailu"></a>
 ## Use Mailu

docker-compose.yml

@@ -154,6 +154,8 @@ services:
         - "dockerhost:${DOCKER_HOST_IP}"
       ports:
         - "${WORKSPACE_SSH_PORT}:22"
+        - "${WORKSPACE_BROWSERSYNC_HOST_PORT}:3000"
+        - "${WORKSPACE_BROWSERSYNC_UI_HOST_PORT}:3001"
         - "${WORKSPACE_VUE_CLI_SERVE_HOST_PORT}:8080"
         - "${WORKSPACE_VUE_CLI_UI_HOST_PORT}:8000"
       tty: true

env-example

@@ -166,6 +166,8 @@ WORKSPACE_INSTALL_WKHTMLTOPDF=false
 WORKSPACE_INSTALL_GNU_PARALLEL=false
 WORKSPACE_INSTALL_AST=true
 WORKSPACE_AST_VERSION=1.0.3
+WORKSPACE_BROWSERSYNC_HOST_PORT=3000
+WORKSPACE_BROWSERSYNC_UI_HOST_PORT=3001
 WORKSPACE_VUE_CLI_SERVE_HOST_PORT=8080
 WORKSPACE_VUE_CLI_UI_HOST_PORT=8001
 WORKSPACE_INSTALL_GIT_PROMPT=false