webpack configuration to use dev server without add localhost switch on source

.htaccess

<IfModule mod_rewrite.c>
  RewriteEngine On

  # redirect every requested real file (.js, .css, ecc ...) to webpack dev server
  RewriteCond  %{REQUEST_FILENAME} -f
  RewriteRule  ^public/assets/(.*)$  http://localhost:3000/assets/$1 [L]
  
</IfModule>

webpack.config.js

var webpack = require('webpack');
module.exports = function(env) {
  var config = {
	entry: {
            "main": [
                // ... source js path
            ]
        },
 	output: {
        path: path.resolve(__dirname, 'web/public'),
   	      filename: "assets/js/[name].bundle.js"
 	},
    devServer: {
        contentBase: __dirname + '/web/public',
        hot: true,
        inline: true,
        host: "localhost",
        port: 3000,
        headers: {
            "Access-Control-Allow-Origin": "*",
            "Access-Control-Allow-Methods": "GET, POST, PUT, DELETE, PATCH, OPTIONS",
            "Access-Control-Allow-Headers": "X-Requested-With, content-type, Authorization"
        }
     },
  };
 
config.plugins = [
  new webpack.HotModuleReplacementPlugin(),
  // ...
  ]
  
  return config;
};

Follow below steps to use WDS (webpack dev server) with apache to serve assets path directly from dev server without add any bad switch code to your sources

1. add devServer section to webpack.config.js
2. add RewriteCond/RewriteRule snippet to your .htaccess con public path