The first commit

webpack.config.js

@@ -0,0 +1,91 @@
+const path = require('path')
+const MiniCssExtractPlugin = require('mini-css-extract-plugin')
+const HtmlWebpackPlugin = require('html-webpack-plugin')
+const {CleanWebpackPlugin} = require('clean-webpack-plugin')
+const TerserPlugin = require("terser-webpack-plugin")
+
+let mode = 'development', target = 'web'
+
+if (process.env.NODE_ENV === 'production') {
+  mode = 'development'
+  target = 'browserslist'
+}
+
+const plugins = [
+  new CleanWebpackPlugin(),
+  new MiniCssExtractPlugin(),
+  new HtmlWebpackPlugin({
+    template: './src/index.html',
+    inject: 'body'
+  }),
+]
+
+console.log( process.env.SOURCE_MAP_ENV )
+
+module.exports = {
+  mode: mode,
+  target: target,
+  module: {
+    rules: [
+      {
+        test: /\.(jpe?g|png|gif|svg)$/i,
+        type: "asset",
+      },
+      {
+        test: /\.css$/i,
+        use: [
+          {
+            loader: MiniCssExtractPlugin.loader,
+            // This is required for asset imports in CSS, such as url()
+            options: { publicPath: '' },
+          },
+          'css-loader',
+          ///"postcss-loader",
+          // according to the docs, sass-loader should be at the bottom, which
+          // loads it first to avoid prefixes in your sourcemaps and other issues.
+          //"sass-loader",
+        ],
+      },
+      {
+        test: /\.js$/,
+        exclude: /node_modules/,
+        use: {
+          loader: 'babel-loader',
+        },
+      },
+    ],
+  },
+  entry: { app: './src/index' },
+  output: {
+    path: path.resolve(__dirname, 'dist'),
+    filename: '[name].[hash].js',
+  },
+  plugins: plugins,
+  devtool: mode === 'production' ? 'source-map' : ( process.env.SOURCE_MAP_ENV ? 'source-map' : false ),
+  optimization: {
+    minimize: true,
+    minimizer: [
+      new TerserPlugin({
+        extractComments: true,
+        terserOptions: {
+          ecma: 5,
+          compress: {
+            drop_console: mode === 'production',
+          },
+        },
+      }),
+
+    ],
+  },
+  devServer: {
+    static: path.resolve(__dirname, 'dist'),
+    compress: true,
+    port: 1976,
+    liveReload: true,
+    /*overlay: {
+      warnings: true,
+      errors: true,
+    }*/
+
+  },
+}