When building a website on platforms like Netlify, it’s common to want to make certain parts of the website public on GitHub to allow for easy contributions from others. In this blog, we’ll explore how to achieve this using Git submodules.

Let’s say you have a website built with Hugo, and you want to make the handbook folder within the content directory public on GitHub. Here’s a step-by-step guide on how to accomplish this:

  1. Create a new repository specifically for the handbook folder on GitHub.

  2. Remove the existing content/handbook folder from your parent Hugo repository. Note that this step is only necessary if you already have content in the handbook folder that you want to move.

rm -rf content/handbook

  1. Commit the changes in your parent repository.

  2. Add the submodule to your parent repository using the following command:

git submodule add https://github.com/username/handbook

(replace username with your GitHub username and handbook with the actual name of your repository)

  1. Deploy your website on Netlify, and it will automatically pick up the submodule.

Now, let’s discuss the local setup. By default, there won’t be a symlink to the submodule repository folder, which might cause some issues. Here’s how to address this:

  1. Remove the content/handbook folder from your parent repository (if it still exists).

  2. Create a symlink from the local repository of the submodule using the following command:

ln -s ../../../dev/handbook/

(adjust the path based on the location of your submodule repository)

  1. Stop tracking the content/handbook folder using the following Git command:
git update-index --skip-worktree content/handbook

(If you want to restore tracking, use --no-skip-worktree instead)

By following these steps, you can have the advantages of using a submodule while still having a symlink locally to the submodule repository.

Tags: Git submodules, website deployment, Hugo, GitHub, Netlify