mirror of
https://github.com/hanzoai/next.js.git
synced 2026-09-24 17:00:51 +00:00
18faa9f114
Hi there, I was trying to understand how to use [examples/github-pages](https://github.com/vercel/next.js/tree/canary/examples/github-pages) and when I followed the instructions my page was rendering without stylesheets. I found the extant README content to be clear, but after I found https://github.com/vercel/next.js/discussions/38777 I was able to understand what the current content meant, so I thought it would be helpful to add this to the original example. Open to edits on content or clarity. Thanks! --------- Co-authored-by: JJ Kasper <[email protected]>
1.3 KiB
1.3 KiB
Deploying to GitHub Pages
This example supports deploying a statically exported Next.js application to GitHub Pages.
The out directory should not be ignored by version control.
How to use
Execute create-next-app with npm, Yarn, or pnpm to bootstrap the example:
npx create-next-app --example github-pages nextjs-github-pages
# or
yarn create next-app --example github-pages nextjs-github-pages
# or
pnpm create next-app --example github-pages nextjs-github-pages
Deploy to GitHub Pages
- Create a new public GitHub repository.
- Edit
next.config.jsto match your GitHub repository name:- Given the pattern
https://github.com/<user>/<repo>, update yourbasePathconfig to/repo.
- Given the pattern
- Push the starter code to the
mainbranch. - Run the
deployscript (e.g.npm run deploy) to create thegh-pagesbranch. - On GitHub, go to Settings > Pages > Branch, and choose
gh-pagesas the branch with the/rootfolder. Hit Save. - Make a change.
- Run the
deployscript again to push the changes to GitHub Pages.
Congratulations! You should have a URL like:
https://<github-user-name>.github.io/<github-project-name>/