const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const CleanWebpackPlugin = require('clean-webpack-plugin');
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const webpack = require('webpack');
const BrowserSyncPlugin = require('browser-sync-webpack-plugin');
module.exports = {
	entry: {
		output: ['css-hot-loader/hotModuleReplacement', './src/index.js']
	},
	devtool: 'inline-source-map',
	devServer: {
		contentBase : './dist',
		historyApiFallback : true,
		inline : true,
		hot : true
	},
	module : {
		rules : [
			{

				test : /\.less$/,
				use: [ "style-loader", "css-hot-loader", MiniCssExtractPlugin.loader, "css-loader", 'less-loader']
			}/*,
			{
				test: /\.js$/,
				exclude: /node_modules/,
				loader: "babel-loader"
			}*/
		]
	},
	plugins: [
		new MiniCssExtractPlugin("styles.css"),
		new webpack.NamedModulesPlugin(),
		new webpack.HotModuleReplacementPlugin(),
		new BrowserSyncPlugin({
			host : 'localhost',
			port : 3000,
			proxy: 'http://localhost:8080/'
		},{
			reload: false
		})
	],
	output: {
		filename: 'bundle.js',
		path: path.resolve(__dirname, 'dist')
	}
};