gulp-browsersync-inject

Injects BrowserSync JavaScript into an HTML file; this is useful for proxy mode without directly modifying the HTML file..

Information

Usage

Install

$ npm install gulp-browsersync-inject --save-dev

Example

var gulp = require('gulp');
var browserSyncInject = require('gulp-browsersync-inject');

// Basic usage:
gulp.task('injectBrowserSync', function(){
  gulp.src('./index.html')
  .pipe(browserSyncInject({port: 5000})) // BrowserSync will output the proxy port
  .pipe(gulp.dest('./'));
});

Options

options.port (REQUIRED)

The port to which is being proxied. This is the port which BrowserSync is listening on.

Type: `Number`

Example:

.pipe(browserSyncInject({port: 5000}))

options.version

The version of the BrowserSync library. BrowserSync will output this value when launched.

Type: `String`
Default: `2.24.4`

Example:

.pipe(browserSyncInject({version: true}))

options.protocol

The protocol to use (http or https). If not specified, the injected code will default to no protocol, causing the browser will use the served protocol.

Type: `String`
Default: ``

Example:

.pipe(browserSyncInject({protocol: 'http', port: 5000}))

options.path

The path to the JavaScript file. Only specify the file without version or extension.

Type: `String`
Default: `/browser-sync/browser-sync-client`

Example:

.pipe(browserSyncInject({path: '/browser-sync/custom-browser-sync-client', port: 5000})) // Puts the information into the 'head' DOM element

options.tag

Set a specific tag to insert before it.

Type: `String`
Default: `head`

Example:

.pipe(browserSyncInject({tag: 'head', port: 5000})) // Puts the information into the 'head' DOM element

options.indent

Number of spaces for indentation (for formatting).

Type: `Number`
Default: `4`

Example:

.pipe(browserSyncInject({indent: 2, port: 5000}))

options.template

The raw template to inject. All options are resolvers and will be resolved at injection time.

Type: `String`
Default:

'<script type=\'text/javascript\' id="__bs_script__">//<![CDATA[
        document.write("<script async src=\'${PROTOCOL}//HOST:${PORT}${PATH}.${VERSION}.js\'><\\\/script>".replace("HOST", location.hostname));
'//]]></script>'

Example:

.pipe(browserSyncInject({template: customTemplateString, port: 5000}))

LICENSE

MIT License