Search code examples
bashgitshgithub-pagesvuepress

split and push committed files to two different branches


I would like to create a website with VuePress and deploy it with Github Pages. Luckily VuePress is able to generate a dist folder with all the required .html files. This folder is located at (from root) ./docs/.vuepress/dist so I could take all the files from that folder and deploy them.

Unfortunately Github Pages can only deploy files from the master branch

https://help.github.com/en/articles/configuring-a-publishing-source-for-github-pages

and it is not possible to configure a specific folder for the build files. I thought about the following solution:

Create a "dev" branch next to the master branch and keep the files from the dist folder in the master branch and have the project in the dev branch.

I started learning using Git on the terminal and created a publish.sh file to commit and push the project to the Github repository.

git add *
git commit -m "."
git push origin master

How can I enhance my shell script to do the following (if possible)

git add *
git commit -m "."

git push -- all files -- origin dev

git push -- all files of the dist folder -- origin master

Solution

  • You can do this by having two sandboxes pointing to the same GitHub repo, one with your dev branch checked out, where you modify the files, and one with your master branch checked out, for updating the dist files.

    Here I'm assuming <repo> already exists on GitHub, but it may or may not have branches yet.

    Set up your dev branch where you edit your code:

    git clone <repo> repo.dev
    cd repo.dev
    git checkout -b dev  # remove -b if origin/dev exists
    # edit, commit, edit, commit, edit, commit
    git push --set-upstream origin dev # remove --set-upstream if you removed -b above
    

    Set up your master branch where you publish your code:

    cd ..
    git clone <repo> repo.dist
    cd repo.dist
    git checkout -b master # remove -b if origin/master exists
    # copy the .vuepress/dist directory into this sandbox as required for deployment
    git add .
    git commit -m 'initial dist'
    git push --set-upstream origin master # remove --set-upstream if you removed -b above
    

    Now, the next time you want to make a change:

    cd ../repo.dev
    # edit, commit, edit, commit, edit, commit
    # make vuepress update repo.dist/.vuepress/dist,
    # possibly by symlinking it from your repo.dev sandbox.
    cd ../repo.dist
    git commit -a -m'updated dist'
    git push
    

    Now, this solution has exactly the weakness @NitsanAvni mentioned in a comment to his answer: the master and dev branches have nothing in common, not even their initial commit. So this might not be better than having two repos, but it does keep things together, which I can see could be convenient.

    Note: you need two separate sandboxes, even if you have just one remote repo, because otherwise it is impossible to have up-to-date views on different branches simultaneously in the same sandbox.