Syncing Files to Our Vagrant Development Environment

In the past, if we want to have files that were accessible by the VM but could also be edited in an editor on the host we would have to clone the project into our VM, set up a shared directory, and then map the share in our host computer. Thankfully Vagrant allows us to easily tap into a feature know as synced folders that make this process so much easier.

Synced Folder Support

With a synced folder we can automatically sync any changes from a folder on the host computer to a folder in the guest.

How syncing works in very basic image

To enable this feature we need to set up a line in our Vagrantfile using the config.vm.synced_folder directive. Our preference is to map the project into a folder inside the vagrant user’s home directory so we can quickly access it when we vagrant ssh into the system. An example Vagrantfile is listed below that will set up a basic share in this manner.

Vagrant.configure("2") do |config|
  config.vm.box = "generic/ubuntu2004"
  config.vm.synced_folder ".", "/home/vagrant/our-awesome-project"
end

Now when we reload our VM we’ll see an indication that it’s syncing the folder in the output.

default: /home/vagrant/our-awesome-project => /Users/scottkeck-warren/our-awesome-project

When we vagrant ssh we can now go into ~/our-awesome-project and see the contents of the Vagrantfile we’ve created in our host system.

Conclusion

In this article, we discussed how to set up a synced folder using our Vagrantfile.

In our next article, we’ll discuss how to use Vagrant’s provisioning system to set up a basic LAMP stack with PHP 8 on Ubuntu.