webpack.config.js

const path = require('path'),
webpack = require("webpack"),
settings = require('./settings'),
ExtractTextPlugin = require('extract-text-webpack-plugin'),
autoprefixer = require("autoprefixer"),
imagemin = require('imagemin'),
imageminJpegRecompress = require('imagemin-jpeg-recompress'),
CleanWebpackPlugin = require('clean-webpack-plugin'),
HtmlWebpackInlineSVGPlugin = require('html-webpack-inline-svg-plugin'),
BrowserSyncPlugin = require('browser-sync-webpack-plugin');
var ImageminPlugin = require('imagemin-webpack-plugin').default;

const extractPlugin = new ExtractTextPlugin({
	filename:  '../style.css',

});

module.exports = {
	mode: 'development',
	devtool: 'source-map',
 // context: settings.themeLocation,
	entry: {
		App: settings.themeLocation + "src/js/app.js"
	},
	output: {
		path: path.resolve(__dirname, settings.themeLocation + "js"),
		filename: 'bundled.js'
	},


	module: {
		rules: [
			{
				test: /\.js$/,
				exclude: /node_modules/,
				use: [
					{
						loader: 'babel-loader',
						options: {
							presets: ['@babel/preset-env']
						}
					}
				]
			},
			{
				test: /\.scss$/,
				exclude: /node_modules/,
				use: extractPlugin.extract({
					use: ['css-loader', 'postcss-loader', 'sass-loader']
				})
			},
			{
		      test: /\.(woff|woff2|ttf|otf|eot|svg)$/,
		      exclude: /node_modules/,
		      loader: 'url-loader',
		      options: {
		      	outputPath: '//1t-group.com/' + settings.themeLocation + 'fonts/',
		        publicPath: 'fonts/',
		        name: 'fonts/[name].[ext]',
		        limit: 1000
		      }
		    },
			{
			  test: /\.(gif|png|jpe?g|svg)$/i,
			  use: [
			  	{
			  		loader: 'file-loader',
			  		options: {
			  			name: "[name].[ext]",
				      	outputPath: '//1t-group.com/' + settings.themeLocation +  'images/',
				      	publicPath: 'images/',
			  		}
			  	},
			    {
			      loader: 'image-webpack-loader',
			      options: {
			        mozjpeg: {
			          progressive: true,
			          quality: 35
			        },
			        // optipng.enabled: false will disable optipng
			        optipng: {
			          enabled: true,
			        },
			        pngquant: {
			          quality: '65-90',
			          speed: 4
			        },
			        gifsicle: {
			          interlaced: false,
			        },

			      }
			    },
			  ],
			}
			/*{
				test: /\.html$/,
				use: [
					{
						loader: 'html-loader',
				  		options: {
				  			attrs: ['img:src'],
				  			minimize: false,
				  		}
				  	}
				]
			}*/
		]
	},
	plugins: [
		extractPlugin,
		new webpack.LoaderOptionsPlugin({
	        options: {
	            postcss: [
	                autoprefixer()
	            ]
	        }
	    }),
	    new webpack.ProvidePlugin({
        $: 'jquery',
        jQuery: 'jquery',
        'window.jQuery': 'jquery'
      }),

	    new CleanWebpackPlugin(['dist']),

		new BrowserSyncPlugin({
		  files: '**/*.php',
		  proxy: 'http://1t-group.com',
		  injectChanges: true
		})
	],

};