browser-sync-webpack-plugin - npm Package Compare versions

Comparing version 1.0.0 to 1.0.1

package.json

 {
   "name": "browser-sync-webpack-plugin",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "description": "BrowserSync and Webpack integration",
@@ -5,0 +5,0 @@ "keywords": [

README.md

@@ -21,2 +21,5 @@ # [BrowserSync](http://www.browsersync.io/) plugin for [Webpack](http://webpack.github.io/)
 
+If you're not using Webpack Dev Server, you can make BrowserSync to serve your project.
+The setup is pretty easy: just pass the [BrowserSync options](http://www.browsersync.io/docs/options/) to the plugin as the first argument.
+
 In your `webpack.config.js`:
@@ -28,10 +31,12 @@
 module.exports = {
-    // ...
-    plugins: [
-        new BrowserSyncPlugin({
-          host: 'localhost',
-          port: 3000,
-          server: { baseDir: ['public'] }
-        })
-    ]
+  // ...
+  plugins: [
+    new BrowserSyncPlugin({
+      // browse to http://localhost:3000/ during development,
+      // ./public directory is being served
+      host: 'localhost',
+      port: 3000,
+      server: { baseDir: ['public'] }
+    })
+  ]
 }
@@ -42,2 +47,7 @@ ```
 
+The advanced usage is about using [Webpack Dev Server](https://github.com/webpack/webpack-dev-server) with BrowserSync in order to use awesome features of both.
+
+To achieve this, BrowserSync offers the [proxy](http://www.browsersync.io/docs/options/#option-proxy) option.
+So, basically, you are about to proxy the output from the Webpack Dev Server through BrowserSync to get the best out of both.
+
 In your `webpack.config.js`:
@@ -49,34 +59,29 @@
 module.exports = {
-    // ...
-    plugins: [
-        new BrowserSyncPlugin(
-          // browserSync options
-          // http://www.browsersync.io/docs/options/
-          {
-            host: 'localhost',
-            port: 3000,
-            server: { baseDir: ['public'] }
-          },
-          // plugin options
-          {
-            // browserSync instance name
-            // http://www.browsersync.io/docs/api/#api-name
-            name: 'my-awesome-bs-instance',
-            // browserSync instance init callback
-            // http://www.browsersync.io/docs/api/#api-cb
-            callback: function () {
-              console.log('browserSync started!');
-            },
-            // determines if browserSync should take care
-            // of reload (defaults to true). switching it off
-            // might be useful if you combine this plugin
-            // with webpack-dev-server to reach
-            // Hot Loader/Hot Module Replacement tricks
-            reload: true
-          }
-        )
-    ]
+  // ...
+  plugins: [
+    new BrowserSyncPlugin(
+      // BrowserSync options
+      {
+        // browse to http://localhost:3000/ during development
+        host: 'localhost',
+        port: 3000,
+        // proxy the Webpack Dev Server endpoint
+        // (which should be serving on http://localhost:3100/)
+        // through BrowserSync
+        proxy: 'http://localhost:3100/'
+      },
+      // plugin options
+      {
+        // prevent BrowserSync from reloading the page
+        // and let Webpack Dev Server take care of this
+        reload: false
+      }
+    )
+  ]
 }
 ```
 
+Another plugin options supported are `name` - BrowserSync [instance name](http://www.browsersync.io/docs/api/#api-name)
+and `callback` - BrowserSync [instance init callback](http://www.browsersync.io/docs/api/#api-cb).
+
 ## Contributing:
@@ -83,0 +88,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

5773

increased by9.52%

Number of lines in readme file

90

increased by5.88%

No dependency changes