/**
 * This config handles jsx compilation, es6 compilation
 * and css handling.
 *
 * JS & JSX:
 * --------
 * babel-loader is used in conjuction with the setup in
 * .babelrc to transpile JS and transform JSX into calls
 * that utilize `h` from preact instead of what React
 * provides.
 *
 * CSS:
 * ---
 * style-loader/url is used to convert import './style.css'
 * into a url that is injected into the page that uses the module
 * that had imported the style.css file.
 * file-loader is used to emit the required object as file and to
 * return its public url. publicPath helps form the public url
 * and maps it to the where the bundle is written (output.path)
 */

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

export default {
  entry: './views/app.js',
  output: {
    filename: 'app.[chunkhash].bundle.js',
    path: resolve(__dirname, './views/public/')
  },
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /node_modules/,
        use: 'babel-loader'
      },
      {
        test: /\.css$/,
        use: ExtractTextPlugin.extract({
          fallback: 'style-loader',
          use: 'css-loader'
        })
      }
    ]
  },
  plugins: [
    new ExtractTextPlugin({
      filename: 'app.[contenthash].css',
      disable: false,
      allChunks: true
    }),
    new HtmlWebpackPlugin({
      template: 'views/index.template.html',
      filename: 'index.html',
      showErrors: true,
      inject: true
    })
  ],
  devtool: 'inline-source-map',
  target: 'electron'
}

@@ -291,21 +291,41 @@
 *%0A * CSS
-:%0A * 
+ (OLD WAY):%0A * ----------
 ---%0A * s
@@ -616,16 +616,16 @@
 lic url%0A
-
  * and m
@@ -680,16 +680,842 @@
 t.path)%0A
+ *%0A * CSS (CURRENT WAY):%0A * -----------------%0A * All css text is extracted using the extract-text-webpack-plugin.%0A * It is then written to output.path with the contenthash (same as%0A * chunkhash but extract text plugin calls it contenthash) appended%0A * to the filename. The contenthash depends on the content of the%0A * file hence it remains constant across builds if the file contents%0A * are the same. Same goes for chunkhash used with javascript files.%0A *%0A * HTML:%0A * ----%0A * index.html is now generated by webpack using index.template.html%0A * The html-webpack-plugin adds all the assets (which have hashes in%0A * their file names) to the generated index.html. It adds styles%0A * in the %3Chead%3E and by default the js just before %3C/body%3E.%0A * This makes it straightforward to add assets that have hashes%0A * in their file names.%0A *%0A
  */%0A%0Aimp

Document how assets are bundled