-
Notifications
You must be signed in to change notification settings - Fork 755
Command line only
Whilst the preferred way to use BrowserSync is via a config-file, there may be times when you'd just like to use it directly from the command-line with no config required.
Once you have installed BrowserSync globally, you can move into any directory and use the following commands:
##Available Options:
--files File paths to watch
--server Run a Local server (uses your cwd as the web root)
--directory Show a directory listing for the server
--proxy Proxy an existing server
--config Specify a path to a bs-config.js file
--host Specify a hostname to use
##--files
Specify files and/or patterns to watch.
# Single file
browser-sync start --files "css/core.css"
# Single Pattern
browser-sync start --files "css/*.css"
# Multiple files
browser-sync start --files "css/core.css, css/ie.css"
# Multiple patterns
browser-sync start --files "css/*.css, *.html"
##--server
# Server using current directory as the root
browser-sync start --server
# Server using the 'app' directory as the root
browser-sync start --server "app"
# Server using current directory as the root with directory listing
browser-sync start --server --directory
##--directory (use with --server)
# Server using current directory as the root with directory listing
browser-sync start --server --directory
##--proxy
# Using a local.dev vhost
browser-sync start --proxy "local.dev"
# Using a local.dev vhost with PORT
browser-sync start --proxy "local.dev:8001"
# Using a localhost address
browser-sync start --proxy "localhost:8080"
# Using a localhost address in a sub-dir
browser-sync start --proxy "localhost:8080/site1"
##--config
Provide a path to the bs-config.js
file (created with browser-sync init
)
browser-sync start --config app/conf/bs-config.js
##--host
Override the hostname detection
browser-sync start --server --host "127.0.0.1"
#Examples
###Watching files
# Watch ALL CSS files in a directory for changes
browser-sync start --files "app/css/*.css"
# Watch ALL CSS files & HTML files in a directory for changes
browser-sync start --files "app/css/*.css, app/*.html"
###Watching files + your existing Server (proxy)
# Using a local.dev vhost
browser-sync start --proxy "local.dev" --files "app/css/*.css"
# Using a local.dev vhost with PORT
browser-sync start --proxy "local.dev:8001" --files "app/css/*.css"
# Using a an IP based host
browser-sync start --proxy "192.167.3.2:8001" --files "app/css/*.css"
###Watching files + built-in static server (for html, js & css)
# Watch ALL CSS files for changes with a static server
browser-sync start --files "app/css/*.css" --server
# Watch ALL CSS files for changes with a static server & specify that the base dir should be "app"
browser-sync start --files "app/css/*.css" --server "app"
# Watch ALL CSS files for changes with a static server & specify that the base dir should be "app" & show a directory listing
browser-sync start --files "app/css/*.css" --server "app" --directory
Watch ALL CSS files for changes with a static server & specify that the base dir should be "app" & specify the index file (note the missing l)
browser-sync start --files "app/css/*.css" --server "app" --index "index.htm"
# Watch ALL CSS files for changes with a static server & specify that the base dir should be "app" & with ghostMode disabled
browser-sync start --files "app/css/*.css" --server "app" --ghostMode false