- FIXED
https
option is no longer clobbered when running from the CLI 27a08c2
-
ADDED - better support for per-route static file serving 97dd907
For example, let's say you have a deployed Wordpress website athttp://example.com
where the assets live insidewp-content/themes/awesome/
. Now lets imagine you need to make small CSS tweaks instyle.css
, but you don't want the hassle of running PHP + MySQL on your local machine... With Browsersync you can now easily map remote paths to local ones. So if you have the filewp-content/themes/awesome/style.css
on your machine, you could run the following and have your changes update the live website./** * This example will proxy an EXISTING website * whilst serving assets from your local directory. * This is crazy-powerful, especially when you consider * it works across all devices. */ const bs = require('browser-sync').create(); bs.init({ proxy: 'http://example.com', files: ['htdocs/wp-content/themes/awesome'], // watch files serveStatic: [ { route: '/wp-content/themes/awesome', // remote path dir: 'htdocs/wp-content/themes/awesome' // local path } ] });
This kind of magic was always possible with Browsersync, but it required more complicated setup that we're happy to see the back of. The best bit is that the proxy will kick in if a file is not found locally. So in our Wordpress example, you could have nothing but a CSS file and everything would still work.
A knock-on effect of this feature is that now you can map multiple remote paths to multiple local directories... I know, it's magical and amazing.
// map 2 remote paths to 1 local directory serveStatic: [ { route: ['/wp-content/themes/theme1', '/wp-content/themes/theme2'], dir: './my-local' // local path } ]
// map 1 remote path to 2 local directories serveStatic: [ { route: '/wp-content/themes/theme1', dir: ['./my-local', './tmp'] // local path } ]
-
ADDED support for opening browsers with flags** #1179
For example, if you wanted to open Chrome with certain flags when Browsersync starts, you can do
const bs = require('browser-sync').create(); bs.init({ server: './app', browser: [ { app: [ 'chromium-browser', '--app=http://localhost:8080', '--proxy-server=localhost:8080', '--user-data-dir=.tmp/chomium' ] } ] });
This can also be combined with the string-only versions too - so to open chrome with flags, but safari + firefox as normal:
const bs = require('browser-sync').create(); bs.init({ server: './app', browser: [ { app: [ 'chromium-browser', '--app=http://localhost:8080', '--proxy-server=localhost:8080', '--user-data-dir=.tmp/chomium' ] }, 'safari', 'firefox' ] });