const ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin'); const HtmlWebpackPlugin = require('html-webpack-plugin'); const MiniCssExtractPlugin = require('mini-css-extract-plugin'); const webpack = require('webpack'); const path = require('path'); const env = process.env; const exec = require('child_process').execSync; module.exports = { mode: `${env.NODE_ENV ? env.NODE_ENV : 'production'}`, entry: [ path.join(__dirname, './src/index.js') ], devtool: env.NODE_ENV === 'production' ? 'source-map' : 'eval', output: { path: path.join(__dirname, 'dist'), filename: '[name].[hash].js', publicPath: '/' }, resolve: { extensions: [".ts", ".tsx", ".js", ".jsx"] }, devServer: { compress: true, port: 8080, historyApiFallback: true, hot: env.NODE_ENV === 'development', proxy: { '/api': { target: 'http://127.0.0.1:8081', } } }, module: { rules: [ { test: /\.tsx?$/, exclude: /node_modules/, loaders: ['ts-loader'] }, { test: /\.module\.css$/, use: [ { loader: '@teamsupercell/typings-for-css-modules-loader', }, { loader: MiniCssExtractPlugin.loader, }, { loader: "css-loader", options: { modules: true } } ] }, { test: /^((?!\.module).)*css$/, use: [ { loader: MiniCssExtractPlugin.loader, }, { loader: "css-loader" }, ] } ] }, plugins: [ new ForkTsCheckerWebpackPlugin(), new HtmlWebpackPlugin({ title: '⏱️ Guesstimate', scriptLoading: 'defer', template: path.join(__dirname, 'src/index.html') }), new webpack.WatchIgnorePlugin([ /css\.d\.ts$/ ]), new MiniCssExtractPlugin({ filename: '[name].[hash].css' }), new webpack.DefinePlugin({ __BUILD__: JSON.stringify({ gitRef: getCurrentGitRef(), buildDate: new Date(), }) }) ] }; function getCurrentGitRef() { return exec("git log -n 1 --pretty='format:%h'").toString() }