Upgrade to Webpack v2.

This required config changes. Also fixed duplicated PostCSS warning messages appearing in the console since postcss-reporter was updated.

Closes #17 and somehow fixes #20.

package.json

@@ -29,7 +29,7 @@
     "eslint": "^3.13.1",
     "eslint-config-barebones": "^0.1.3",
     "exports-loader": "^0.6.3",
-    "extract-text-webpack-plugin": "^1.0.1",
+    "extract-text-webpack-plugin": "^2.0.0-beta.5",
     "http-server": "^0.9.0",
     "imports-loader": "^0.7.0",
     "postcss-cssnext": "^2.9.0",
@@ -40,7 +40,7 @@
     "style-loader": "^0.13.1",
     "stylelint": "^7.7.1",
     "stylelint-config-barebones": "^0.1.2",
-    "webpack": "^1.14.0"
+    "webpack": "^2.2.0"
   },
   "babel": {
     "presets": [
@@ -51,6 +51,15 @@
       "transform-runtime"
     ]
   },
+  "postcss": {
+    "plugins": {
+      "postcss-import": {},
+      "postcss-cssnext": {},
+      "postcss-reporter": {
+        "clearReportedMessages": true
+      }
+    }
+  },
   "eslintConfig": {
     "parser": "babel-eslint",
     "extends": "barebones",

webpack.config.js

@@ -1,44 +1,54 @@
-const path = require('path')
 const webpack = require('webpack')
 const ExtractTextPlugin = require('extract-text-webpack-plugin')
-const atImport = require('postcss-import')
-const cssnext = require('postcss-cssnext')
-const reporter = require('postcss-reporter')
 
 module.exports = {
   entry: [
     './components/app/index.js',
     './components/app/index.css'
   ],
   output: {
-    path: path.resolve('./bundle'),
+    path: './bundle',
     filename: 'bundle.js'
   },
   devtool: 'source-map',
   module: {
-    loaders: [{
-      test: /\.js$/,
-      exclude: /node_modules/,
-      loader: 'babel?cacheDirectory'
-    }, {
-      test: /\.css$/,
-      loader: ExtractTextPlugin.extract('style', 'css?sourceMap&-autoprefixer&importLoaders=1!postcss')
-    }]
+    rules: [
+      {
+        test: /\.js$/,
+        exclude: /node_modules/,
+        loader: 'babel-loader',
+        options: {
+          cacheDirectory: true
+        }
+      },
+      {
+        test: /\.css$/,
+        loader: ExtractTextPlugin.extract({
+          fallbackLoader: 'style-loader',
+          loader: [
+            {
+              loader: 'css-loader',
+              query: {
+                importLoaders: 1,
+                sourceMap: true
+              }
+            },
+            {
+              loader: 'postcss-loader'
+            }
+          ]
+        })
+      }
+    ]
   },
   plugins: [
     new webpack.ProvidePlugin({
-      'fetch': 'imports?this=>global!exports?global.fetch!whatwg-fetch'
+      'fetch': 'imports-loader?this=>global!exports-loader?global.fetch!whatwg-fetch'
     }),
     new webpack.optimize.UglifyJsPlugin({
-      compress: {
-        warnings: false
-      }
+      comments: false,
+      sourceMap: true
     }),
     new ExtractTextPlugin('bundle.css')
-  ],
-  postcss: [
-    atImport,
-    cssnext,
-    reporter({clearMessages: true})
   ]
 }