github pages部署html静态页核心三点:仓库命名/结构合规、index.html必须存在、pages功能需手动开启;任一不满足则无法生成访问地址,且不因等待而自动修复。

GitHub Pages 部署 HTML 静态页,核心就三点:仓库命名/结构合规、index.html 必须存在、Pages 功能手动开启。不满足任一条件,页面就不会上线——不是“等一会儿”,而是根本不会生成访问地址。
仓库名必须是 用户名.github.io(用户站点)或任意名(项目站点)
两种模式对应不同访问路径,选错会导致 404 或 HTTPS 不生效:
- 用户站点:仓库名严格为
你的用户名.github.io,部署后网址是https://你的用户名.github.io,根路径直接可访,适合个人主页 - 项目站点:仓库名随意(如
my-landing-page),网址是https://你的用户名.github.io/my-landing-page/,注意末尾有斜杠,且所有资源路径要相对或带前缀 - 用户站点只能建一个;项目站点每个仓库都能开,但必须设为 Public(Private 仓库需 GitHub Pro 才能启用 Pages)
index.html 必须在根目录,且不能依赖后端逻辑
GitHub Pages 是纯静态文件服务器,它不会执行任何服务端代码:
- 放一个
index.html就能打开首页;没这个文件,即使有demo.html也 404 -
api.php、server.js、.htaccess全部无效——它们会被当普通文本下载,而不是运行 - 前端路由(如 Vue Router 的
history模式)会 404,必须改用hash模式,或在vite.config.js中配base: '/仓库名/'
必须手动进 Settings → Pages 开启,不能只靠 push
很多人 push 完就等链接,结果半天没反应——因为 Pages 默认是关闭的:
- 进仓库 →
Settings→ 左侧菜单点Pages(在 Code and automation 分类下) - Source 选分支(通常是
main),Folder 选/(root),点Save - 保存后等 30 秒到 2 分钟,页面下方会出现绿色提示:
Your site is live at https://... - 如果提示 “Page build warning”,点进去看日志,常见原因是用了 Jekyll 不支持的文件名(如下划线开头)或 YAML front matter 格式错
最容易被忽略的是:项目站点的子路径(如 /my-landing-page/)会直接影响所有 <link>、<script></script>、图片 src 的相对路径解析。本地双击 HTML 能跑,上传后全 404,大概率是这里没调好。
前端入门到VUE实战笔记:立即使用
在学习笔记中,你将探索 前端 的入门与实战技巧!











