// Development config
const merge = require("webpack-merge");
const webpack = require("webpack");
const FaviconsWebpackPlugin = require("favicons-webpack-plugin");

const commonConfig = require("./common");

module.exports = merge(commonConfig, {
  mode: "development",
  entry: [
    "react-hot-loader/patch", // Activate HMR for React
    "webpack-dev-server/client?http://0.0.0.0:8080", // Bundle the client for webpack-dev-server and connect to the provided endpoint
    "webpack/hot/only-dev-server", // Bundle the client for hot reloading, only- means to only hot reload for successful updates
    "./index.tsx" // The entry point of our app
  ],
  devServer: {
    hot: true, // Enable HMR on the server
    historyApiFallback: true,
    // public: '0.0.0.0:8080',
  },
  devtool: "cheap-module-eval-source-map",
  plugins: [
    new FaviconsWebpackPlugin({
      logo: "./assets/img/favicon.png",
      icons: {
        android: false,
        appleIcon: false,
        appleStartup: false,
        coast: false,
        favicons: true,
        firefox: false,
        opengraph: false,
        twitter: false,
        yandex: false,
        windows: false
      }
    }),
    new webpack.HotModuleReplacementPlugin(), // Enable HMR globally
    new webpack.NamedModulesPlugin() // Prints more readable module names in the browser console on HMR updates
  ]
});