VueJS and GitHub pages — the simplest!

Sabina Niewiadomska
2 min readMay 8, 2019

Vue CLI documentation for GitHub pages deployment is simple, clear and straightforward, although many of us still might have problems with deployment 😅.

Here I would like to share my simple advice on how to follow official instructions 😻.

Photo by Ben White on Unsplash

“ 1. Set correct publicPath in vue.config.js.”

Yes, you have to create vue.config.js, add it on the same level where package.json is

“ Inside your project, create deploy.sh with the following content (with highlighted lines uncommented appropriately) and run it to deploy:”

Inside your project is where?

Again it can be on the same level as package.json (root directory)

What deploy.sh is doing?

Deploy.sh is a file which consists of a set of commands for npm with instructions on how to build your project.

Where are highlighted lines?

Well, highlighted lines are more black, start from #, and these ones should be uncommented appropriately.

Where to run it to deploy?

On Windows machine, you should use Git Bash. Open your project folder, right-click somewhere and chose from the menu “Git Bash here”.

How to run deploy.sh?

You should write following command into Git Bash command line:

sh deploy.sh

Hurrray! Now you should be able to see your page on GitHub pages!

P.S. Useful links:

  1. Connecting to GitHub with SSH
  2. Deploy vue-cli 3 project to github pages

--

--