2

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
Compo
  • 36,585
  • 5
  • 27
  • 39
Question3r
  • 2,166
  • 19
  • 100
  • 200

2 Answers2

3

Maybe add an additional repo inside the dist folder, which will be synced to the Github Pages repo, only containing the relevant files.

can do it with:

$ cd dist
$ git init
$ git remote add origin <github-pages-repo>
$ git add .
$ git commit -m 'initial commit'
$ git push origin master
Nitsan Avni
  • 753
  • 6
  • 6
  • So you think it's not possible with only one repo? – Question3r May 19 '19 at 07:34
  • I guess it's possible, but probably will need to jump through some hoops in order to modify the folder structure. Also the two branches would have nothing in common; it's as if they're on separate repos anyway. I wouldn't recommend it. – Nitsan Avni May 19 '19 at 09:55
2

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.

joanis
  • 10,635
  • 14
  • 30
  • 40