Setup project for Github Pages integration
-
Configure
vite
by setting correctbase
option. Updatevite.config.js
If you are deploying to
https://<USERNAME>.github.io/<REPO>/
, for example your repository is athttps://github.com/<USERNAME>/<REPO>
, then setbase
to'/<REPO>/'
.
export default defineConfig({ plugins: [vue()], + base: '/vue-ts/',
git add -u
git commit -m "update vite's 'base' option for github pages"
Prepare our sources
npm run bulid
onmain
branch.-
Let's setup
gh-pages
branch that will contain our site source. From docs:The default publishing source for project sites is the root of the
gh-pages
branch.
# Create a new branch, with no history or contents, called gh-pages and switches to the gh-pages branc $ git checkout --orphan gh-pages
-
Clear the index and the working tree right after creating the orphan branch.
$ git rm -rf .
-
Put
dist/
folder contents into root of a project.
mv dist/* . && rmdir dist/
git add assets/ favicon.ico index.html
git commit -m 'deploy' --no-verify
. We are adding--no-verify
here to skip pre-commit checks, which will fail because we have deleted.pre-commit-config.yaml
from this branch.
Deploy to Github Pages with Github Actions
Creating vite vue ts template: Deploy to Github Pages with Github Actions
Sardorbek Imomaliev ・ Jul 30 '21
Links
- https://docs.github.com/en/pages/getting-started-with-github-pages/about-github-pages
- https://docs.github.com/en/pages/setting-up-a-github-pages-site-with-jekyll/creating-a-github-pages-site-with-jekyll
- https://vitejs.dev/guide/static-deploy.html#github-pages
- https://cli.vuejs.org/guide/deployment.html#github-pages
- https://pre-commit.com/#temporarily-disabling-hooks
Top comments (0)