Hexo进阶

• 关于Hexo如何制作博客主页详见这里。

现象描述

​ 按照hexo+github pages的博客搭建部署流程，hexo的博客主页会部署在https://yourgithubname.github.io/。本来没什么问题的，但是后面我想做一个个人主页（学术主页），按照academicpages/academicpages.github.io或者RayeRen/acad-homepage.github.io的方案，使用的也是https://yourgithubname.github.io/。这时候就有问题了，博客和个人主页的域名不就冲突了？

• 我的目的是实现下面功能的东西。

从yourgithubname.github.io进入，访问的是我的个人主页。通过个人主页可以跳转到博客、建立页面。

从yourgithubname.github.io/blogs进入，访问的是我的博客，就是用hexo搭建好的。

从yourgithubname.github.io/resume进入，访问的就是我的一个个人简历。

• 本人菜鸡，完全不懂前端。尝试了几种不同的方案，包括切换repo分支的谜之操作，都试了，都不行。最后发现原来是对Hexo进行部署了解的不够细致。

Hexo部署过程

​ 按照之前介绍Hexo搭建个人博客中的流程做好如下设置：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

# URL
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url: http://yourgithubname.github.io # 注意这里的url就是能够通过外网访问的博客主页链接，也就是Hexo将博客主页的内容放在了这个对应的同名仓库
root: /
permalink: :year/:month/:day/:title/
permalink_defaults:
pretty_urls:
  trailing_index: true # Set to false to remove trailing 'index.html' from permalinks
  trailing_html: true # Set to false to remove trailing '.html' from permalinks
  
  ...
  ...
  
deploy:
  type: git 
  repo: git@github.com:yourgithubname/yourgithubname.github.io.git
  branch: master

​ 然后执行hexo d，这样通过上面的url：http://yourgithubname.github.io就可以看到部署好的博客页面了。

1
2
3
4
5
6
7
8
9
10
11
12
13
14

Mode                 LastWriteTime         Length Name
----                 -------------         ------ ----
d-----      2023-02-25  上午 11:45                .deploy_git
d-----      2023-02-06  上午 11:48                node_modules
d-----      2023-02-25  上午 11:44                public
d-----      2023-02-01  上午 11:08                scaffolds
d-----      2023-02-25  上午 09:24                source
d-----      2020-02-23  下午 04:10                themes
-a----      2020-02-23  下午 03:24             71 .gitignore
-a----      2023-02-25  上午 11:44         951152 db.json
-a----      2023-02-06  上午 11:48         138563 package-lock.json
-a----      2023-02-06  上午 11:48            678 package.json
-a----      2023-02-25  上午 11:56            203 README.md
-a----      2023-02-25  上午 11:44           3532 _config.yml

• 同时我在这个路径下初始化一个私有的仓库Blog，利用git管理这些写好的文件，防止丢失。也方便在不同的电脑端进行再次搭建。私有Blog仓库不会被别人访问到。别人只能看到yourgithubname.github.io这个仓库中的内容，但是这里面是经过处理的内容，无法逆向解析，我做不到。。。

Github Pages

​ GitHub Pages是GitHub提供的一个网页寄存服务，于2008年推出。可以用于存放静态网页，包括博客、项目文档甚至整本书。Jekyll软件可以用于将文档转换成静态网页，该软件提供了将网页上传到GitHub Pages的功能。一般GitHub Pages的网站使用github.io的子域名，但是用户也可以使用第三方域名。

​ 按照Hexo博客部署的教程，我之前相当于开了一个yourgithubname.github.io的公有仓库，通过Pages的设置中的Build and deployment中激活了yourgithubname.github.io这个github上的次级域名。这个域名外网可以访问到。

​ 那么部署是在做什么呢：简单来说就是在本地构建一个静态网页，然后发到特定的域名的过程。比如这里Hexo搭建的时候，通过Node.js帮我们搞了很多事情，利用Hexo提供的模板做了静态网页，然后用github pages蹭了一个域名，通过Hexo将网页信息部署到了https://yourgithubname.github.io主页的过程。部署时的内容生成到了yourgithubname.github.io这个仓库。（别人只能访问Hexo部署之后生成的文件）

• 理论上来说可以在github构建无限的公有仓库，都设置次级域名，都可以通过xxx访问了。

解决方案

1. 新建一个blogs公开仓库（私有是不行的，和yourgithubname.github.io仓库同理），在仓库Settings中找到Pages,在Build and deployment中的Branch上设置main分支，/root路径，然后save。（中间可能会等一会，github pages响应一下）会发现在上方的GitHub Pages处，已经显示Your site is live at https://yourgithubname.github.io/blogs/了。（激活了新的次次级域名）
2. 然后在Hexo的根目录下的_config.yml设置url和root如下：（调整网站部署的域名地址）

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

# URL
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url: http://whu-lyh.github.io/blogs # 这个域名是新的已经更新的博客的主页地址，与blogs仓库同名
root: /blogs # 这里按照要求也要修改
permalink: :year/:month/:day/:title/
permalink_defaults:
pretty_urls:
  trailing_index: true # Set to false to remove trailing 'index.html' from permalinks
  trailing_html: true # Set to false to remove trailing '.html' from permalinks
  
  ...
  ...
  
deploy:
  type: git 
  repo: git@github.com:whu-lyh/blogs.git
  branch: main

3. 重新hexo clean -g, hexo g, hexo d。
4. 然后就成了。从https://yourgithubname.github.io/blogs访问博客页面了。

再说一下错误的方案：

• github仓库的setting中的Pages下面有个Custom domain，这个域名是要重新买的，搞一个CNAME，然后绑定到这里。就可以实现自定义域名访问了。
• 之前还试过调整yourgithubname.github.io这个仓库下面的分支，还以为调整分支能实现我的目的，结果发现完全不对。

个人主页

​ fork一个academicpages.github.io，然后按照这个改一下，每次只需要修改内容之后push到对应的仓库，等待一会就自动部署到github.io上，即可看到页面更新了。如果不在本地预览，那么修改完主页内容之后，直接push到github.io的仓库就行， github pages会重新自动部署。

• 但是后面发现这个主页非常的臃肿，里面很多不需要的冗余内容，因此换成了这个。操作同理。

个人简历

​ resume可以用类似的方式搞一个repo，然后找一些简历模板，css的。本地可以编辑好，采用和blogs相同的步骤部署就行。

• 也可以使用\(\LaTeX\)来写，比如这里。直接在overleaf上面就能修改。

参考资料

• https://blog.csdn.net/xuedan1992/article/details/83445756
• https://goddywu.github.io/2018/02/24/%E4%BD%BF%E7%94%A8github%E5%AD%90%E7%9B%AE%E5%BD%95%E9%83%A8%E7%BD%B2hexo%E4%B8%AA%E4%BA%BA%E5%8D%9A%E5%AE%A2/
• https://docs.github.com/en/pages/quickstart