const webpack = require('webpack'); const path = require('path'); const HtmlWebpackPlugin = require('html-webpack-plugin'); const LodashModuleReplacementPlugin = require('lodash-webpack-plugin'); const config = { entry: [ 'react-hot-loader/patch', './src/index.tsx' ], output: { path: path.resolve(__dirname, 'docs'), filename: 'bundle.js' }, module: { rules: [ { test: /\.(js|jsx)$/, use: 'babel-loader', exclude: /node_modules/ }, { test: /\.css$/, use: [ 'style-loader', 'css-loader' ] }, { test: /\.ts(x)?$/, loader: 'ts-loader', exclude: /node_modules/ }, { test: /\.(png|gif|jpe?g|svg)$/, type: 'asset/resource' } ] }, plugins: [ new HtmlWebpackPlugin({ templateContent: ({ htmlWebpackPlugin }) => '<!DOCTYPE html><html><head><meta charset=\"utf-8\"><title>' + htmlWebpackPlugin.options.title + '</title></head><body><div id=\"app\"></div></body></html>', filename: 'index.html', }), new webpack.ContextReplacementPlugin(/moment[\/\\]locale$/, /en/), new LodashModuleReplacementPlugin ], devServer: { 'static': { directory: path.resolve(__dirname, 'docs') } }, resolve: { extensions: [ '.tsx', '.ts', '.js' ], alias: { 'react-dom': '@hot-loader/react-dom' } } }; module.exports = config;