fix browsersync reload, 🆙 deps n readme

README.md

@@ -6,7 +6,7 @@
 
 ## TL;DR
 
-Used latest tools: Gulp4, Babel6, Webpack2, PostCSS
+Used latest tools: Gulp, Babel, Webpack, PostCSS
 
 - Styles (css4) - [stylelint](http://stylelint.io/) -> [postCSS](https://www.npmjs.org/package/gulp-postcss)([postcss-import](https://www.npmjs.org/package/postcss-import), [postcss-url](https://www.npmjs.org/package/postcss-url), [cssnext](https://www.npmjs.org/package/postcss-cssnext)(autoprefixed), [cssnano](https://www.npmjs.org/package/cssnano))
 - Scripts (es2015+) - [eslint](https://www.npmjs.org/package/eslint) -> [webpack](https://webpack.js.org)([babel-loader](https://www.npmjs.org/package/babel-loader), [babel-preset-env](https://www.npmjs.com/package/babel-preset-env), [uglify-js](https://www.npmjs.org/package/gulp-uglify))
@@ -17,14 +17,14 @@ Used latest tools: Gulp4, Babel6, Webpack2, PostCSS
 
 ## Installing
 
-- You must have [nodejs](http://nodejs.org/) (includes [npm](https://www.npmjs.org/)) installed
+- You must have [nodejs](https://nodejs.org/) (includes [npm](https://www.npmjs.org/)) installed
 
 ```sh
 $ sudo
 $ npm i
 ```
 
-This project uses Gulp4 so we should have `gulp-cli` installed globally to use npm scripts using local gulp:
+This project uses Gulp4 so we should have `gulp-cli` or `npx` (goes with npm v5.3.0+) installed globally to use npm scripts using local gulp:
 
 ```sh
 $ npm i -g gulp-cli

gulpfile.js

@@ -15,7 +15,7 @@ const webpack = require('webpack');
 const webpackConfig = require('./webpack.config');
 
 const $ = gulpLoadPlugins();
-const reload = browserSync.reload;
+const server = browserSync.create();
 const isDev = !process.env.NODE_ENV || process.env.NODE_ENV === 'development';
 
 console.log(`process.env.NODE_ENV = ${process.env.NODE_ENV}`); // eslint-disable-line
@@ -57,8 +57,9 @@ const scripts = (done) => {
 
     $.util.log('[webpack]', stats.toString({
       // output options
-      // https://github.com/webpack/docs/wiki/node.js-api
+      // https://webpack.js.org/configuration/stats/
       chunks: false,
+      // modules: false,
       colors: true,
     }));
 
@@ -156,8 +157,13 @@ const html = () =>
       title: 'html',
     }));
 
+const reload = (done) => {
+  server.reload();
+  done();
+};
+
 const watch = () => {
-  browserSync({
+  server.init({
     notify: false,
     logPrefix: 'gg',
     server: isDev ? 'src' : 'dist',