DEV Community

Cover image for How to deploy to GitHub Pages using gh-pages package
Mateusz Mistecki
Mateusz Mistecki

Posted on

How to deploy to GitHub Pages using gh-pages package

1) First setup GitHub Pages on the GitHub quickstart
2) Install gh-pages package. It can be installed to devDependencies.
NPM

npm i gh-pages
Enter fullscreen mode Exit fullscreen mode

Yarn

yarn add --dev gh-pages
Enter fullscreen mode Exit fullscreen mode

3) Add the following line to your scripts in package.json assuming your application is build to dist/spa directory.

dist/spa directory

"deploy": "gh-pages -d dist/spa"

Enter fullscreen mode Exit fullscreen mode

E.g.

"scripts": {
    "lint": "eslint --ext .js,.vue ./",
    "format": "prettier --write \"**/*.{js,vue,scss,html,md,json}\" --ignore-path .gitignore",
    "test": "echo \"No test specified\" && exit 0",
    "build": "quasar build",
    "deploy": "gh-pages -d dist/spa",
    "postinstall": "patch-package"
  },
Enter fullscreen mode Exit fullscreen mode

4) Build your app. In my example to do that I use the following command

yarn build
Enter fullscreen mode Exit fullscreen mode

5) Deploy app to GitHub pages:

yarn deploy
Enter fullscreen mode Exit fullscreen mode

Top comments (0)