host github pages from /dist folder in master branch

Question

I was trying to publish my -username-.github.io repository to github pages but my index.html is inside dist folder.

I cannot use git subtree push --prefix dist origin gh-pages because this is meant for project pages, not user/org pages.

All I want is, github to treat dist as root directory for hosting user/org page. Please help.Thanks

PS: I don't want to do redirection hack.

Answer 1

Configuring a publishing source for GitHub Pages (very limited)

While you can select a folder as the source for gh-pages, you can only do so for the /docs directory at the parent level, and you still have to actually commit the built files in order to do so, which means you'll have to override the .gitignore and commit them twice

Automated Deploy Scripts

If you're using npm, there are a couple packages that handle publishing sub-directories to gh-pages. Install with option --save-dev to add it to your devDependencies:

• push-dir

  # install
  $ npm install push-dir --save-dev
  
  # usage
  $ push-dir --dir=dist --branch=gh-pages
  

• gh-pages

  # install
  $ npm install gh-pages --save-dev
  
  # usage
  $ gh-pages -d dist
  

In either case, if get a command line tool working for you and get it configured with the right options, you can alias it in your package.json like this:

"scripts": {
  "deploy": "npm run build && gh-pages -d dist"
}

Further Reading:

• Deploying a subfolder to GitHub Pages
• Deploy Vue to GitHub pages-the easy way!

Answer 2

You can't do it this way.

GitHub pages can be hosted from either:

• the / folder in the master branch
• the / folder in the gh-pages branch
• the /docs folder in the master branch

But the user pages must be built from the / folder in the master branch.

TIP

Code on another branch than the master. After every push to this branch, build it in any CI/CD tool and push it back to the master branch.