3、创建站点

在 repo 下创建 index.md 文件，随便写点东西保存。然后，点击 settings 选项卡，单机左侧 Pages 进行设置，如下图：

🔊 此时站点已经建成，可以访问 https://<username>.github.io/ 查看，如果已经有个人域名了，也可以绑定个人域名，继续往下看👇

4、仓库文件目录

5、绑定域名

我个人购买的一级域名是 i-xiao ，域名后缀是 space，专门给GitHub Pages 增加一个CNAME记录（blog），解析二级域名，绑定 github.io 域名。

5.1、域名相关知识

www：主机名，i-xiao : 域名主体(一级域名)，.space : 域名后缀 注册一级域名的时候是需要付费的

二级域名，是依附一级域名的存在而存在的，也就是说要是顶级域名消失了，二级域名也也会不复存在。反而来说，二级域名的网站不做了，主域名网站是不受影响的。

一级域名、二级域名区别： DNS收录一级域名更快；还有就是解析速度，下一跳路由就不说了，找到目的主机之后，二级域名层级更深，需要多一层计算（其实这是我瞎写的🤣，猜测应该跟 nginx location匹配类似）

5.2、GitHub上配置自定义域名

进入 <username>github.io 仓库，进入设置页面，点击左边 Pages 选项卡，进行下面的配置。

6、配置域名映射

各记录类型使用目的

7、DNS检测

8、查看Pages

成功解析之后，还存在DNS缓存，一般还需要再等待一会（一般十分钟，或许更长时间）才能生效，如下图成功显示👇

站点绑定的域名已经更换，访问请到👉 这里

🎈🎈🎈

🌹 持续更文，关注我，你会发现一个踏实努力的宝藏前端😊，让我们一起学习，共同成长吧。

🎉 喜欢的小伙伴记得点赞关注收藏哟，回看不迷路 😉

🎁 欢迎大家评论交流, 蟹蟹😊

相关推荐

sherlockkid7

部署个人博客到Github Pages

我正在参加「掘金·启航计划」 前言 之前使用vuepress2搭建了一个简单的笔记类博客（具体实现可以查看这篇文章），但是一直没有部署到线上，今天抽时间部署到GitHub上，并记录下部署过程。 具体操

• 634
• Cleaner VuePress

使用 VuePress + GitHub Pages + GitHub Actions 搭建个人博客

本篇文章主要介绍使用 VuePress + GibHub Pages 搭建个人博客，并使用 GibHub Actions 实现博客自动化部署的详细步骤。

• 981

使用Github Pages搭建个人博客

Github Pages是Github提供的免费静态网站托管服务，可以很方便的用于个人博客搭建、项目展示页搭建，甚至是初创团队的产品展示页等都是可以的。

• 213

无需付费 GitHub Pages，轻松搭建个人博客

Hexo 是一个快速、简单且功能强大的博客框架。使用 Markdown 解析文档，Hexo 能在几秒内生成带有自定义主题并集成各项功能的网站页面。 本文采用 Github Pages + Hexo 的

• 404
• GitHub

使用 GitHub Actions 构建、部署 Next.js 并将其托管到 GitHub Pages

本文是一个简单教程，将 Next.js 制作的静态网站, 通过 GitHub Actions构建打包，最后将其自动化部署到 GitHub Pages用于展示

• 500

工作这么久, 还不懂GitHub Pages自动化部署吗 ？

最新GitHub Pages自动化部署教程和报错处理, 提交代码到github, 自动部署到github pages, 白嫖github的服务器

• 518
• Node.js GitHub

【GitHub Action / Pages】自动化部署同步掘金平台

自动化同步文章平台（auto-sync-blog），实现每日自动化执行任务：指定用户或指定专栏的文章， 并将文章目录链接更新至GitHub Pages. 同时，对文章进行时间分类，更直观的...

• 5746
• 许愿不秃头 JavaScript

Docsify+GithubPages建立个人知识Wiki及Gitalk踩坑指南

使用docsify和githubpages建立个人的知识体系Wiki网站，并引入gitalk进行评论

• 814
• SaebaRyo

通过Hexo + Github Pages部署你的react项目

通过Hexo + Github Pages白嫖服务器部署你的react项目。让你免去配置web服务器的烦恼！！

• 1169
• qiuliang GitHub

VitePress + Github Pages 搭建自己的个人博客

前言 写下来的东西远比记住的东西永久，很多时候我们记录自己的知识但是我们又不想搞的很麻烦，我在看来目前 VitePress + Github Pages 的组合是一个不错的选择。 VitePress

• 1553
• RickZhou

Sticky Note | 单页应用 Github Pages 刷新 404

背景 单页应用部署在 Github Pages 后 刷新 404 解决 Github Pages 在找不到页面的情况下 会默认去加载 404.html 利用这个特性 我们可以...

• 697
• 三山望远山 GitHub

使用 Zola 和 Github Pages 搭建网站

使用 Zola 作为静态网站生成器搭建个人网站和博客，并使用 Github Actions 部署到 Github Pages。

• 2924
• Dcose

Docusaurus + Github Pages 搭建博客

记录 Docusaurus + Github Pages 搭建博客，希望大家可以一起无限学习，无限进步！！！！

• 1353
• 廊坊吴彦祖 GitHub VuePress

VuePress + Github Pages 搭建博客网站

VuePress + Github Pages 搭建博客网站，VuePress 是基于 Vue 的静态网站生成器，GitHub Pages 是通过 GitHub 托管和发布的公共网页

• 339
• codinglin VuePress GitHub

手把手教你用 VuePress + GitHub Pages 搭建个人博客

前言 最近在阅读冴羽老师的文章时，对个人博客很感兴趣，于是试着自己搭建了一遍，写了这篇文章记录一下搭建的基本流程，希望对大家有所帮助......

• 8107