var path = require('path');
var webpack = require('webpack');
var HtmlWebpackPlugin = require('html-webpack-plugin');
var AppCachePlugin = require('appcache-webpack-plugin');

module.exports = function(options) {
  var entry, jsLoaders, plugins;

  // If production is true
  if (options.prod) {
    // Entry
    entry = [
      path.resolve(__dirname, 'js/app.js') // Start with js/app.js...
    ];
    // Loaders for JS
    jsLoaders = ['babel'];
    // Plugins
    plugins = [// Plugins for Webpack
      new webpack.optimize.UglifyJsPlugin({ // Optimize the JavaScript...
        compress: {
          warnings: false // ...but do not show warnings in the console (there is a lot of them)
        }
      }),
      new HtmlWebpackPlugin({
        template: 'index.html', // Move the index.html file...
        minify: { // Minifying it while it is parsed using the following, self–explanatory options
          removeComments: true,
          collapseWhitespace: true,
          removeRedundantAttributes: true,
          useShortDoctype: true,
          removeEmptyAttributes: true,
          removeStyleLinkTypeAttributes: true,
          keepClosingSlash: true,
          minifyJS: true,
          minifyCSS: true,
          minifyURLs: true
        }
      }),
      new AppCachePlugin({
        cache: ['index.html', 'js/bundle.js', 'serviceworker.js']
      })
    ];

  // If app is in development
  } else {
    // Entry
    entry = [
      "webpack-dev-server/client?http://localhost:3000", // Needed for hot reloading
      "webpack/hot/only-dev-server", // See above
      path.resolve(__dirname, 'js/app.js') // Start with js/app.js...
    ];
    // Add react-hot loader for js files
    jsLoaders = ['babel'];
    // Only plugin is the hot module replacement plugin
    plugins = [
      new webpack.HotModuleReplacementPlugin() // Make hot loading work
    ]
  }

  return {
    entry: entry,
    output: { // Compile into js/build.js
      path: path.resolve(__dirname, 'build'),
      filename: "js/bundle.js"
    },
    module: {
      loaders: [{
          test: /\.js$/, // Transform all .js files required somewhere within an entry point...
          loaders: jsLoaders, // ...with the specified loaders...
          exclude: path.join(__dirname, '/node_modules/') // ...except for the node_modules folder.
        }, {
          test:   /\.css$/, // Transform all .css files required somewhere within an entry point...
          loader: "style-loader!css-loader!postcss-loader" // ...with PostCSS
        }, {
          test: /\.jpe?g$|\.gif$|\.png$/i,
          loader: "url-loader?limit=10000"
        }
      ]
    },
    plugins: plugins,
    postcss: function() {
      return [
        require('postcss-import')({ // Import all the css files...
          onImport: function (files) {
              files.forEach(this.addDependency); // ...and add dependecies from the main.css files to the other css files...
          }.bind(this) // ...so they get hot–reloaded when something changes...
        }),
        require('postcss-simple-vars')(), // ...then replace the variables...
        require('postcss-focus')(), // ...add a :focus to ever :hover...
        require('autoprefixer')({ // ...and add vendor prefixes...
          browsers: ['last 2 versions', 'IE > 8'] // ...supporting the last 2 major browser versions and IE 8 and up...
        }),
        require('postcss-reporter')({ // This plugin makes sure we get warnings in the console
          clearMessages: true
        })
      ];
    },
    target: "web", // Make web variables accessible to webpack, e.g. window
    stats: false, // Don't show stats in the console
    progress: true
  }
}
@@ -237,16 +237,28 @@
  plugins
+, cssLoaders
 ;%0A%0A  // 
@@ -413,19 +413,19 @@
     
-// 
+css
 Loaders 
 for 
@@ -424,38 +424,65 @@
 ers 
-for JS%0A    jsLoaders = %5B'babel
+= %5B'file-loader?name=%5Bpath%5D%5Bname%5D.%5Bext%5D', 'postcss-loader
 '%5D;%0A
@@ -1699,68 +1699,67 @@
     
-// Add react-hot loader for js files%0A    jsLoaders = %5B'babel
+cssLoaders = %5B'style-loader', 'css-loader', 'postcss-loader
 '%5D;%0A
@@ -2216,20 +2216,17 @@
 ader
-s
 : 
-jsLoaders
+'babel'
 , //
@@ -2492,50 +2492,21 @@
 ader
+s
 : 
-%22style-loader!
 css
--l
+L
 oader
-!postcss-loader%22
+s
  // 

Fix CSS loader