How to setup Apache virtual hosts for development environment on local machines

apache-dev-setup.md

Apache Development Environment

How to setup Apache when working with virtual hosts in a development environment on local machines.

httpd.conf

Uncomment the following lines to allow the VirtualDocumentRoot and CacheDisable directives.

#LoadModule vhost_alias_module modules/mod_vhost_alias.so
#LoadModule cache_module modules/mod_cache.so

httpd-vhosts.conf

Add the following to your vhosts config file. Edit the path in VirtualDocumentRoot and Directory to your folder structure for Apache.

<VirtualHost *:80>
	ServerName localhost
	VirtualDocumentRoot "/www/htdocs"
</VirtualHost>

<VirtualHost *:80>
	UseCanonicalName Off
	ServerAlias *.localhost
	VirtualDocumentRoot "/www/sites/%0"
	<Directory "/www/sites/*">
		Options Indexes FollowSymLinks
		Require all granted
		AllowOverride All
   	</Directory>
	CacheDisable "/"
	LogFormat "%V %h %l %u %t \"%r\" %s %b" vcommon
	ErrorLog "logs/dev-error.log"
	CustomLog "logs/dev-access.log" vcommon
</VirtualHost>

hosts

Add the domains to your hosts file, these domains will be redirected to your machine. Note that .localhost is used to avoid conflicts with real sites.

# Dev
127.0.0.1	domain1.localhost
127.0.0.1	domain2.localhost

Folder structure

Make a folder where your sites are located matching the domain name from your hosts file, including the .localhost suffix.

Changed the .dev to .localhost because Google registered the .dev gTLD which causes some browsers to force SSL.

Added the CacheDisable directive to disable the cache by default on localhost.

When it comes to upkeeping WordPress websites with this configuration I run into various errors that I am wildly guessing are caused by the domain name being *.localhost and that being different than the wordpress site configuration.

I had an idea to change the ubuntu hosts files to

# Dev
127.0.0.1 www.domain1.com domain1.com
127.0.0.1 www.domain2.com domain2.com

and then comment those out after I am finished pushing changes. I have worked with companies doing this in the past and I prefer it (cause it makes the most sense in my head and seemed to not have issues with wordpress installs). |

Ccould you possibly give an example virtualhost configuration for this type of apache config?

I would guess something like this after looking at the docs for an eye-itching number of hours

<VirtualHost *:80>
    ServerName localhost
    VirtualDocumentRoot "/www/htdocs"
</VirtualHost>

<VirtualHost *:80>
    UseCanonicalName Off
    ServerAlias *
   VirtualDocumentRoot "/www/sites/%0"
   <Directory "/www/sites/*">
       Options Indexes FollowSymLinks
       Require all granted
       AllowOverride All
   </Directory>
</VirtualHost>

But that gives an err_connection_refused when visiting domain1.com

I noticed that visiting anything like domain1.com.localhost would serve the /www/htdocs folder instead of /www/sites folder for that name