How do I configure the Dev Server to work with PHP in 2024?

General
1

Can someone help me configure the Dev-server to work with PHP in 2024? I’ve found plenty of examples online, but most seem to be for older versions of Webpack. Any guidance would be greatly appreciated!

I’ve set up a VirtualHost in Apache using XAMPP on my local machine:

<VirtualHost *:80>
      DocumentRoot "C:\Users\44\Desktop\portfolio"
      ServerName poetfolio.localhost
      <Directory "C:\Users\44\Desktop\portfolio">
        Require all granted
        AllowOverride All
        Order allow,deny
        Allow from all
      </Directory>
</VirtualHost>

Webpack devServer config:

devServer: {   
    compress: true,   
    port: 8080,            
    proxy: [
        {
            '/api': {
                target: 'http://portfolio.localhost:80',
                changeOrigin: true,
                secure: false,
            },

            devMiddleware: {
                    writeToDisk: true,
            },
        }
    ]
},

"webpack": "^5.93.0"
"webpack-dev-server": "^4.15.0"

The idea is that when I access: http://localhost:8080 (Webpack Dev Server), it should proxy to http://portfolio.localhost:80/ (Apache local vhost). However, this isn’t happening. When I access http://localhost:8080/index.html and try to click on a .php link, the file just gets downloaded instead of being executed.

Here’s what my entire webpack.dev.js file looks like: webpack.dev.js