webrouse / n-asset-macro

import ExtractTextPlugin from 'extract-text-webpack-plugin';

import ContentHashPlugin from 'webpack-content-hash';

import ManifestPlugin from 'webpack-manifest-plugin';

import CleanWebpackPlugin from 'clean-webpack-plugin';

// Config

const publicDir = 'www';

const buildDir = 'dist';

const manifest = `${publicDir}/manifest.json`;

module.exports = {

  entry: {

    "app": ['./app/scripts/index.js', './app/styles/main.scss'],

  },

  output: {

    filename: `${publicDir}/${buildDir}/[name].[content:8].js`

  },

  module: {

    rules: [

      // JS

      {

        test: /\.js$/,

        exclude: /(node_modules|bower_components)/,

        use: {

          loader: 'babel-loader',

          options: {

            presets: ['env']

          }

        }

      },

      // SASS

      {

        test: /\.scss$/,

        loader: ExtractTextPlugin.extract(['css-loader', 'sass-loader'])

      }

    ]

  },

  plugins: [

    new ExtractTextPlugin({

      filename: `${publicDir}/${buildDir}/[name].[content:8].css`,

      allChunks: true,

    }),

    new ContentHashPlugin(),

    new ManifestPlugin({

      fileName: manifest,

    }),

    new CleanWebpackPlugin(

      [`${publicDir}/${buildDir}`, manifest],

      {

        verbose: false,

        watch: true,

      }),

  ]

};