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
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.