A Webpack configuration file with style loading

style.webpack.complete.js

import { resolve } from 'path';
import ExtractTextPlugin from 'extract-text-webpack-plugin';

const cssLoaders = [
  { loader: 'css-loader' },
  { loader: 'sass-loader' },
  { loader: 'postcss-loader' },
];

const devLoaders = [{ loader: 'style-loader' }].concat(cssLoaders);

module.exports = env => {
  const config = {
    context: resolve('src/js'),
    entry: {
      main: ['babel-polyfill', './app.js'],
    },
    output: {
      path: resolve('public/dist'),
      filename: '[name].js',
      publicPath: '/dist/',
    },
    plugins: [],
    module: {
      rules: [
        {
          test: /\.js$/,
          use: {
            loader: 'babel-loader',
          },
        },
        {
          test: /\.hbs$/,
          use: {
            loader: 'handlebars-loader',
          },
        },
        {
          test: /\.scss$/,
          exclude: /node_modules/,
          use: env.dev ? devLoaders : ExtractTextPlugin.extract({
            fallback: 'style-loader',
            use: cssLoaders,
          })
        }
      ]
    },
    resolve: {
      modules: [resolve('./frontend/js')],
      extensions: ['.js', '.hbs'],
    }
  };
  
  if (env.prod) {
    config.plugins.push(new ExtractTextPlugin({
        filename: '[name].css',
    }));
  }
  
  return config;
};