目录
  1. 1. 前言
  2. 2. 搭建hexo
    1. 2.1. 安装node.js
    2. 2.2. 安装git
    3. 2.3. 安装hexo
    4. 2.4. 初始化hexo
  3. 3. 搭建github/gitee(码云) pages
    1. 3.1. 前言
    2. 3.2. 修改配置文件
    3. 3.3. 在 Github 和 Gitee 上各自创建一个仓库
    4. 3.4. 仓库的命名
    5. 3.5. 配置 SSH key
      1. 3.5.1. 创建RSA密钥对
      2. 3.5.2. Github 配置 SSH key
      3. 3.5.3. Gitee 配置 SSH key
      4. 3.5.4. 验证 SSH 连接
  4. 4. 本地运行
    1. 4.1. 启动服务
  5. 5. 部署服务
    1. 5.1. 安装插件
    2. 5.2. 推送服务器
    3. 5.3. 访问:
Hexo+Github/Gitee搭建静态网站博客

前言

Hexo是一个快速,简单,功能强大的开源博客框架。
GitHub/Gitee Pages 是一个国内外静态资源网站。
两者结合可以搭建用户自己的静态网站。

搭建hexo

安装node.js

根据操作系统,在官网下载对应的安装包,地址为:node.js
下载之后,安装即可。

安装git

根据操作系统,在官网下载对应的安装包,地址为:git
下载之后,安装即可,具体安装过程此处不作详细介绍。

安装hexo
1
npm install hexo-cli -g
初始化hexo

选择需要安装的项目目录,执行以下命令:

1
hexo init [项目名称,如hexo]

执行完成后,目录截图如下:

至此,hexo的本地安装已完成。

搭建github/gitee(码云) pages

前言

由于本人需要将Hexo博客同时部署到 Github 和 gitee上 ,所以这里介绍怎么同时部署到这两个网站的pages。
之所以选择这两个网站,是因为国外用户可以访问 Github,而国内用户可以访问 gitee上。优化访问速度。

修改配置文件

在站点根目录下找到_config.yml文件,将里边的deploy节点修改成下边的形式,其中repository等于username ,即

1
2
3
4
5
deploy:
type: git
repo:
github: git@github.com:[username]/[username].github.io.git,master
gitee: git@gitee.com:[username]/[username].git,master

将上边的仓库url的{username}/{repository}改成自己的项目地址,这里使用的是SSH协议的Git仓库地址,即:

1
git@{domain}:{username}/{username}.git

推荐使用SSH协议的地址,免去每次pull/push输入账号密码的繁琐,也确保安全。

在 Github 和 Gitee 上各自创建一个仓库

如果我们只是将项目部署到某一个代码托管站点而已,那么该项目仓库的名字可以随便起。
但是现在我们需要将项目同时部署到 Github 和 Gitee 上,那就不能随意命名了。
我们需要采用特定的命名方式,才能正确将Hexo博客同时部署到这两个站点上;否则很可能会导致只有博客的主页能访问到,而其他的路径全部失效。

仓库的命名

对于 Gitee,你可以选择建立一个私人仓库来部署自己的Hexo博客,不过和 Github 不同的地方在于:
Github 的仓库名要命名为: {username}.github.io
而 Coding.net 的仓库名要命名为:{username}
这里的 username 指的是你在这两个网站上的用户名,只有以这种命名形式的仓库,才能够不通过子域名的形式来访问我们的博客。
比如说,我的 Github 和Gitee 的账号都是jack,那么在部署博客成功后,我就可以通过下边的url来访问我的Hexo博客:

1
2
https://jack.github.io/
https://jack.gitee.io

如果将仓库名命名为其他的形式,比如:hexo-blog,那么要访问该博客,就需要输入下边的url:

1
2
https://jack.github.io/hexo-blog
https://jack.coding.me/hexo-blog

这里的仓库名hexo-blog就变成了子域名,于是问题就来了,对于存在子域名的Hexo博客,需要在站点配置文件里配置url节点:

1
2
3
4
5
6
# URL
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url: http://yoursite.com
root: /
permalink: :year/:month/:day/:title/
permalink_defaults:

如果不配置这里的url节点,会导致除了首页以外的所有页面都请求404
但是我们由于是同时部署在两个网站上,其父域名是不一样的,那么这里的url节点也就只能配置一个而牺牲另一个了;
但是如果你有自己的域名,就可以解决这个问题了:直接在这里配置自己的域名就行了。

配置 SSH key

如果在Linux/Mac环境下,可以直接在terminal中执行key生成命令,Windows需要打开git bash,具体方法为鼠标右键->选择Git Bash。

创建RSA密钥对

执行以下命令:
ssh-keygen -t rsa -b 4096 -C "your_email@example.com"
看到提示就按一次回车,在连续三次回车后,就表示创建成功了。
接着将~/.ssh目录下将里边的id_rsa.pub文件里的内容复制到剪切板。

Github 配置 SSH key

登陆 Github 的账号:
进入 Settings 页面
选择 SSH and GPG keys
点击 New SSH key
填写 Title(用来给公钥起一个名字,以便和其他的公钥区分开来)
然后在 Key 里将我们刚刚复制的公钥粘贴进去
最后点击 Add SSH key,这时候 GitHub 会要你输入账号密码进行确认。

Gitee 配置 SSH key

登陆Gitee的账号:
点击用户头像->进入个人设置
选择安全设置->SSH公钥
选择新增公钥
填写标题:公钥标题key
填写公钥:把我们刚刚复制的公钥粘贴到这里
添加后输入输入账号密码进行确认

验证 SSH 连接

使用Git Bash输入:
ssh -T git@github.com
第一次连接时会问你是否继续连接,输入 yes 即可;
接下来验证Gitee的ssh连接:
ssh -T git@gitee.com
同样输入 yes 即可。
至此,则github/gitee page搭建完成。

本地运行

启动服务

在项目根目录执行:hexo s
执行成功,则显示如下:

打开http://localhost:4000 即可在本地访问。

部署服务

安装插件
1
$ npm install hexo-deployer-git --save
推送服务器
1
$ hexo deploy
访问:

gitee的访问:https://[gitee的用户名].github.io
github的访问:https://[github的用户名].github.io

文章作者: 李浩
文章链接: https://leehoward.cn/2019/10/13/Hexo-Github-Gitee搭建静态网站博客/
版权声明: 本博客所有文章除特别声明外,均采用 CC BY-NC-SA 4.0 许可协议。转载请注明来自 leehoward
打赏
  • 微信
  • 支付宝

评论