diff --git a/docs/src/app.js b/docs/src/app.js
index 6812651..7e66ed1 100644
--- a/docs/src/app.js
+++ b/docs/src/app.js
@@ -6,4 +6,4 @@ import Main from './Main';
 import './normalize.scss';
 import './stylesheet.scss';
 
-render(<Main />, document.getElementById('main'));
+render(<Main />, document.querySelector('#main'));
diff --git a/docs/webpack.config.js b/docs/webpack.config.js
deleted file mode 100644
index d11b3ba..0000000
--- a/docs/webpack.config.js
+++ /dev/null
@@ -1,103 +0,0 @@
-// @flow weak
-
-import path from 'path';
-import webpack from 'webpack';
-import HtmlWebpackPlugin from 'html-webpack-plugin';
-import autoprefixer from 'autoprefixer';
-import ExtractTextPlugin from 'extract-text-webpack-plugin';
-import ServiceWorkerWebpackPlugin from '../src/index';
-
-export default function (options) {
-  const webpackConfig = {
-    entry: [
-      './src/app.js',
-    ],
-    output: {
-      path: path.join(__dirname, 'dist'), // No used by webpack dev server
-      filename: '[name].[hash].js',
-    },
-    resolve: {
-      extensions: ['', '.js'],
-      alias: {
-        'serviceworker-webpack-plugin/lib': path.resolve(__dirname, '../src'),
-      },
-    },
-    plugins: [
-      new HtmlWebpackPlugin({
-        template: path.join(__dirname, 'src/index.html'),
-        minify: {
-          removeComments: true,
-          collapseWhitespace: true,
-        },
-      }),
-      new ServiceWorkerWebpackPlugin({
-        entry: path.join(__dirname, 'src/sw.js'),
-        excludes: [
-          '**/.*',
-          '**/*.map',
-          '*.html',
-        ],
-      }),
-      new webpack.DefinePlugin({
-        'process.env': {
-          NODE_ENV: JSON.stringify(options.config.environment),
-        },
-      }),
-    ],
-    postcss: [
-      autoprefixer,
-    ],
-    module: {},
-    devtool: (options.config.environment === 'development') ? 'eval' : null,
-  };
-
-  if (options.config.environment === 'development') {
-    webpackConfig.module.loaders = [
-      {
-        test: /\.js$/,
-        exclude: /node_modules/,
-        loader: 'babel-loader',
-      },
-      {
-        test: /\.scss$/,
-        loaders: [
-          'style-loader',
-          'css-loader',
-          'postcss-loader',
-          'sass-loader',
-        ],
-      },
-    ];
-  } else if (options.config.environment === 'production') {
-    webpackConfig.plugins = webpackConfig.plugins.concat([
-      new webpack.optimize.OccurenceOrderPlugin(),
-      new webpack.optimize.DedupePlugin(),
-      new webpack.optimize.UglifyJsPlugin({
-        compressor: {
-          warnings: false,
-        },
-        output: {
-          comments: false,
-        },
-      }),
-      new ExtractTextPlugin('app.css'),
-    ]);
-
-    webpackConfig.module.loaders = [
-      {
-        test: /\.js$/,
-        loader: 'babel-loader',
-        exclude: /node_modules/,
-      },
-      {
-        test: /\.scss$/,
-        loader: ExtractTextPlugin.extract(
-          'style-loader',
-          'css-loader!postcss-loader!sass-loader',
-        ),
-      },
-    ];
-  }
-
-  return webpackConfig;
-}
diff --git a/docs/webpack.js b/docs/webpack.js
deleted file mode 100644
index a021008..0000000
--- a/docs/webpack.js
+++ /dev/null
@@ -1,85 +0,0 @@
-// @flow weak
-/* eslint-disable no-console */
-
-import minimist from 'minimist';
-import WebpackDevServer from 'webpack-dev-server';
-import webpack from 'webpack';
-import ProgressPlugin from 'webpack/lib/ProgressPlugin';
-import rimraf from 'rimraf';
-import webpackConfig from './webpack.config';
-
-const argv = minimist(process.argv.slice(2));
-
-const PORT_DEV_WEBPACK = 8002;
-
-if (argv.dev === true) {
-  const compiler = webpack(webpackConfig({
-    port: PORT_DEV_WEBPACK,
-    config: {
-      environment: 'development',
-      enableStats: false,
-      failOnUnusedFile: false,
-    },
-  }));
-
-  compiler.apply(new ProgressPlugin((percentage, msg) => {
-    console.log(`${Math.floor(percentage * 100)}%`, msg);
-  }));
-
-  const server = new WebpackDevServer(compiler, {
-    // webpack-dev-server options
-    hot: true,
-    historyApiFallback: true,
-
-    // webpack-dev-middleware options
-    quiet: false,
-    noInfo: false,
-    watchOptions: {
-      aggregateTimeout: 300,
-      poll: 1000,
-    },
-    stats: {
-      modules: false,
-      chunks: false,
-      chunkModules: false,
-      colors: true,
-    },
-  });
-
-  server.listen(PORT_DEV_WEBPACK, undefined, () => {});
-} else {
-  rimraf.sync('dist');
-
-  const compiler = webpack(webpackConfig({
-    config: {
-      environment: 'production',
-      enableStats: false,
-      failOnUnusedFile: true,
-    },
-  }));
-
-  compiler.apply(new ProgressPlugin((percentage, msg) => {
-    console.log(`${Math.floor(percentage * 100)}%`, msg);
-  }));
-
-  compiler.run((err, stats) => {
-    if (err) {
-      throw new Error(err);
-    }
-
-    console.log(stats.toString({
-      colors: true,
-      hash: false,
-      timings: false,
-      assets: true,
-      chunks: false,
-      chunkModules: false,
-      modules: false,
-      children: true,
-    }));
-
-    if (stats.hasErrors()) {
-      throw new Error('Webpack failed');
-    }
-  });
-}
diff --git a/docs/webpack/baseConfig.js b/docs/webpack/baseConfig.js
new file mode 100644
index 0000000..5b4a286
--- /dev/null
+++ b/docs/webpack/baseConfig.js
@@ -0,0 +1,63 @@
+// @flow weak
+
+import path from 'path';
+import HtmlWebpackPlugin from 'html-webpack-plugin';
+import ServiceWorkerWebpackPlugin from '../../src/index';
+
+export default {
+  entry: [
+    './docs/src/app.js',
+  ],
+  output: {
+    pathinfo: false,
+    path: path.join(__dirname, '../dist'), // No used by webpack dev server
+    publicPath: '',
+    filename: 'app.js',
+  },
+  target: 'web',
+  resolve: {
+    extensions: ['.js'],
+    alias: {
+      'serviceworker-webpack-plugin/lib': path.resolve(__dirname, '../../src'),
+    },
+  },
+  module: {
+    rules: [
+      {
+        test: /\.js$/,
+        exclude: /node_modules/,
+        loader: 'babel-loader',
+      },
+      {
+        test: /\.scss$/,
+        loaders: [
+          'style-loader',
+          'css-loader',
+          'postcss-loader',
+          'sass-loader',
+        ],
+      },
+    ],
+  },
+  performance: {
+    maxAssetSize: 4e6,
+    maxEntrypointSize: 6e6,
+  },
+  plugins: [
+    new HtmlWebpackPlugin({
+      template: path.join(__dirname, '../src/index.html'),
+      minify: {
+        removeComments: true,
+        collapseWhitespace: true,
+      },
+    }),
+    new ServiceWorkerWebpackPlugin({
+      entry: path.join(__dirname, '../src/sw.js'),
+      excludes: [
+        '**/.*',
+        '**/*.map',
+        '*.html',
+      ],
+    }),
+  ],
+};
diff --git a/docs/webpack/developmentConfig.js b/docs/webpack/developmentConfig.js
new file mode 100644
index 0000000..edfecf3
--- /dev/null
+++ b/docs/webpack/developmentConfig.js
@@ -0,0 +1,71 @@
+// @flow weak
+
+import webpack from 'webpack';
+import ForceCaseSensitivityPlugin from 'force-case-sensitivity-webpack-plugin';
+import baseConfig from './baseConfig';
+
+const PORT = 8002;
+
+export default {
+  ...baseConfig,
+  output: {
+    ...baseConfig.output,
+    // * filename */ comments to generated require()s in the output.
+    pathinfo: true,
+    publicPath: '/',
+  },
+  // webpack-dev-server options.
+  devServer: {
+    // activate hot reloading.
+    hot: true,
+    historyApiFallback: true,
+    port: PORT,
+
+    // webpack-dev-middleware options.
+    stats: {
+      // Remove built modules information.
+      modules: false,
+      // Remove built modules information to chunk information.
+      chunkModules: false,
+      colors: true,
+    },
+  },
+  module: {
+    rules: [
+      ...baseConfig.module.rules.map((rule) => {
+        if (rule.use === 'babel-loader') {
+          return {
+            ...rule,
+            options: {
+              presets: [
+                ['es2015', {
+                  modules: false,
+                }],
+              ],
+              plugins: [
+                'react-hot-loader/babel',
+              ],
+            },
+          };
+        }
+
+        return rule;
+      }),
+    ],
+  },
+  devtool: 'eval', // no SourceMap, but named modules. Fastest at the expense of detail.
+  plugins: [
+    ...baseConfig.plugins,
+    // Prevent naming issues.
+    new ForceCaseSensitivityPlugin(),
+    // Activates HMR.
+    new webpack.HotModuleReplacementPlugin(),
+    // Prints more readable module names in the browser console on HMR updates.
+    new webpack.NamedModulesPlugin(),
+    new webpack.DefinePlugin({
+      'process.env': {
+        NODE_ENV: JSON.stringify('development'),
+      },
+    }),
+  ],
+};
diff --git a/docs/webpack/productionConfig.js b/docs/webpack/productionConfig.js
new file mode 100644
index 0000000..f4275a2
--- /dev/null
+++ b/docs/webpack/productionConfig.js
@@ -0,0 +1,45 @@
+// @flow weak
+
+import webpack from 'webpack';
+import baseConfig from './baseConfig';
+
+export default {
+  ...baseConfig,
+  module: {
+    rules: [
+      ...baseConfig.module.rules.map((rule) => {
+        if (rule.use === 'babel-loader') {
+          return {
+            ...rule,
+            options: {
+              presets: [
+                ['es2015', {
+                  modules: false,
+                }],
+              ],
+            },
+          };
+        }
+
+        return rule;
+      }),
+    ],
+  },
+  plugins: [
+    ...baseConfig.plugins,
+    new webpack.optimize.UglifyJsPlugin({
+      compress: {
+        warnings: false,
+        screw_ie8: true,
+      },
+      output: {
+        comments: false,
+      },
+    }),
+    new webpack.DefinePlugin({
+      'process.env': {
+        NODE_ENV: JSON.stringify('production'),
+      },
+    }),
+  ],
+};
diff --git a/package.json b/package.json
index 10af7a8..41750c7 100644
--- a/package.json
+++ b/package.json
@@ -14,8 +14,8 @@
     "flow": "flow",
     "build": "babel src --out-dir lib",
     "prepublish": "npm run build",
-    "docs:dev": "cd docs && babel-node webpack.js --dev",
-    "docs:production": "cd docs && babel-node webpack.js"
+    "docs:development": "babel-node ./node_modules/.bin/webpack-dev-server --config=docs/webpack/developmentConfig.js --progress",
+    "docs:production": "rm -rf docs/dist && NODE_ENV=docs-browser-production babel-node ./node_modules/.bin/webpack --config=docs/webpack/productionConfig.js --progress"
   },
   "repository": {
     "type": "git",
@@ -33,8 +33,10 @@
   },
   "homepage": "https://github.com/oliviertassinari/serviceworker-webpack-plugin#readme",
   "dependencies": {
-    "minimatch": "^3.0.3",
-    "webpack": "^1.14.0"
+    "minimatch": "^3.0.3"
+  },
+  "peerDependencies": {
+    "webpack": "1 || ^2 || ^2.2.0-rc"
   },
   "devDependencies": {
     "autoprefixer": "^6.6.0",
@@ -57,6 +59,7 @@
     "eslint-plugin-react": "^6.8.0",
     "extract-text-webpack-plugin": "^1.0.1",
     "flow-bin": "^0.37.4",
+    "force-case-sensitivity-webpack-plugin": "^0.2.1",
     "html-webpack-plugin": "^2.24.1",
     "node-sass": "^4.1.1",
     "postcss-loader": "^1.2.1",
@@ -64,6 +67,7 @@
     "react-dom": "^15.4.1",
     "sass-loader": "^4.1.1",
     "style-loader": "^0.13.1",
-    "webpack-dev-server": "^1.16.2"
+    "webpack": "^2.2.0-rc.0",
+    "webpack-dev-server": "^2.2.0-rc.0"
   }
 }