Hexo搭建博客

simpleai追逐

于 2019-12-11 15:22:52 发布

阅读量191

点赞数 1

文章标签： hexo 搭建博客 GitHub 最新

本文链接：https://blog.csdn.net/qq_37016867/article/details/79904487

版权

1.安装node.js

安装过程会自动配置系统环境变量。（安装之后尽量不要更改文件夹名称，修改文件夹名称系统环境变量不会自动跟随改变，使用软件会出错）

2.安装git

很简单，安装对应自己机器位数的git即可

3.安装hexo（需要先安装好node.js和git)

需要在联网状态下进行,下图红色的Err!是未联网下安装的报错结果。
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-t2ilkouU-1576048944465)(Hexo搭建博客/3-1.png)]

4.建立站点

(1)先在电脑中的某一位置建立好 your_name.github.io 文件夹，比如 E:\your_name.github.io；
(2)在终端中切换到用cd命令 your_name.github.io 文件夹所在的路径。
(3)根据hexo的官方文档开始使用 — 建站，依次执行以下两条命令：

hexo init

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-8ErzShBk-1576048944466)(Hexo搭建博客/4-1.png)]

npm install

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-zeXPYhbY-1576048944467)(Hexo搭建博客/4-2.png)]

安装完成后simpleai.github.io目录下的内容：
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-mcQpGQib-1576048944468)(Hexo搭建博客/4-3.png)]

● _config.yml 文件存放着网站的配置信息，可以在这里配置大部分的参数。
● package.json 文件存放着插件信息，从中可以查看那些插件已经安装。
● scaffolds 是模板文件夹，新建文章时，Hexo 会根据 scaffold 来建立文件，不过这个模板和后面的主题里指的模板不一样。
● source 是存放用户资源的地方的文件夹，除 _posts 文件夹之外，开头命名为 _ (下划线) 的文件 / 文件夹和隐藏的文件将会被忽略。Markdown 和 HTML 文件会被解析并放到 public 文件夹（别急，等下会生成的），而其他文件会被拷贝过去。
● themes 主题文件夹，Hexo 会根据主题来生成静态页面，我们以后自己安装的主题也都会放在这个文件夹下面，默认的 landscape 主题已经在里面了。
（4）根据 Hexo 的官方文档开始使用 — 命令，在终端中敲入（确保路径仍在 your_name.github.io 下；防火墙可能会阻止，点击允许。），

hexo server

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-6bUcrLNG-1576048944471)(Hexo搭建博客/4-4.png)]

可以在 http://localhost:4000/ 中看到我们网站默认的样子了。
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-0dvQrl44-1576048944472)(Hexo搭建博客/4-5.png)]

5.配置站点

在 _config.yml 中，我们可以修改大部份的配置，里面每一个参数的含义可以查看 Hexo 的官方文档开始使用 — 配置，这里我暂且只修改了 title，subtitle 和 author，替换成自己网站的名字和作者名即可。per_page 决定首页显示多少篇文章，默认的 10 篇有点多，我改成了 5 篇。其余的设置，比如 theme，deploy 我们用到了再来更改。

6.生成自己的内容

在 _posts 文件夹下，新建一个 Markdown 文件(.md文件)，或者把以前有的 Markdown 文件复制进来，根据 Hexo 的官方文档基本操作 — Front-matter ，写好你的第一篇文章，比如：
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-ZLnkMUGB-1576048944474)(Hexo搭建博客/6-1.png)]

这里，Front-matter 是文件最上方以 — 分隔的区域，用于指定文章的标题、建立日期、更新日期等，如果主题模板还支持分类和标签的话（比如默认的 landscape 主题），还可以指定分类和标签。根据 Hexo 的官方文档基本操作 — 生成文件，在终端中敲入如下命令：

hexo generate

Hexo 会替我们刚加入到 _posts 文件夹下的 markdown 文件生成静态文件。接着输入命令

hexo server

就可以在 http://localhost:4000/ 中看到我们新添加的网页内容了。至此，我们采用默认主题 landscape 的网站已经生成了，且相信你已经掌握了关于 Hexo 的大部分操作，如果自感还不熟悉，可以再看看 Hexo 的官方文档开始使用 — 命令，主要是下面几个命令：
● hexo init [folder]: 新建一个网站。如果没有设置 folder ，Hexo 默认在目前的文件夹建立网站；
● hexo generate: 生成静态文件；
● hexo server: 启动服务器。默认情况下，访问网址为： http://localhost:4000/；
● hexo deploy: 部署本地文件到网站（后文会用得）；
● hexo clean: 清除缓存文件 (db.json) 和 public 文件夹下已生成的静态文件。

7部署到GitHub

7.1注册账号

7.2github中创建项目

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-v3uDI7La-1576048944477)(Hexo搭建博客/7-1.png)]

Github 的官方文档 Create a new repository on GitHub 已经图文并茂将如何建立一个 repository 交待得非常清楚明白了（英文），唯一要注意的是，第二步里的 Repository name 一定要是 your_name.github.io ，your_name 是 Github 用户名。

7.3配置Git

根据 Github 的官方文档 Setting up Git，这一操作的目的是告诉版本控制软件 Git 接下来这台电脑上提交的文件是 E-mail 地址是什么的某人提交的。在 Git Bash 中执行如下代码即可：

git config --global user.name "YOUR NAME"
git config --global user.email "YOUR EMAIL ADDRESS"

其中，YOUR NAME 是自己取的名字，YOUR EMAIL ADDRESS 是自己的邮箱。由于自己的博客网站就自己一个人提交，所以就都设置成跟 Github 用户名和邮箱相同了。但其实是可以不同，因为对于很多项目，并不只有一个开发者，Github 允许多人向同一个 Repo 提交，这里提供用户名和邮箱，只是为了搞清楚哪些代码是谁提交的。

7.4Git 与 Github 进行身份验证

这一整章，我们的最终目的是实现在终端中敲入 hexo deploy （部署本地文件到网站）后，Hexo 会将我们本地的 public 文件夹下的东西上传到 Github 服务器，这样我们就可以通过 your_name.github.io 这个域名（your_name 是你的 Github 用户名）看到我们已经上网的博客网站了。为了实现这个目的，首先我们先要让本地的电脑和 Github 服务器建立起某种联系，也就是让 Github 服务器信任由我这台电脑提交的东西，接受，并存放到 your_name.github.io 这个 Repo 下面，与 Github 服务器建立信任的这个环节就是身份认证（Authenticating ）。根据 Github 的官方文档 Authenticating with GitHub from Git 这里，我们选择 Connecting over SSH 这一种方式。在 Github 的官方文档 Categories / SSH 下，我们能找到关于 Github 与 SSH 的资料。

7.4.1 生成新的 SSH key

根据 Github 的官方文档 Generating a new SSH key ，我们在 Git Bash 下执行如下命令，生成 SSH key：

ssh-keygen -t rsa -b 4096 -C "your_email@example.com"

其中，your_email@example.com 是你的 Github 注册邮箱。然后，Git Bash 中会出现Generating public/private rsa key pair.

表示新的 SSH 已经生成了。随后会出现
Enter file in which to save the key (/c/Users/han/.ssh/id_rsa):
*Created directory ‘/c/Users/han/.ssh’.*这里 id_rsa是生成的 key 文件的文件名，默认都是这个；如果不是，在后面用到 id_rsa 的地方请替换成出现的名字。这条信息是让你选择 SSH key 存放的地点，按回车选择默认的即可。回车后，还会出现
Enter passphrase (empty for no passphrase):
Enter same passphrase again:
让你设置使用 SSH 密钥时的密码，由于我们都是在自己个人的电脑上操作，所以仍然回车，不设置密码即可。
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-ZScgbEXn-1576048944478)(Hexo搭建博客/7-2.png)]

7.4.2 将 SSH key 添加到 ssh-agent

根据 Wikipedia，ssh-agent 是一个在本地登录会话持续时间内，将未加密的密钥存储在内存中，并使用 Unix 域套接字与 SSH 客户端进行通信的程序。根据 Github 的官方文档 Adding your SSH key to the ssh-agent ，我们在 Git Bash 下执行如下命令，开启 ssh-agent

$ eval "$(ssh-agent -s)"

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-X58tJttb-1576048944480)(Hexo搭建博客/7-3.png)]

然后我们要将这个 SSH key 添加到 ssh-agent 里去，运行如下命令，其中id_rsa 是你的 key 文件的文件名：

$ ssh-add ~/.ssh/id_rsa

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-YOUTeeIy-1576048944481)(Hexo搭建博客/7-4.png)]

7.4.3 将 SSH key 添加到 Github 账户

Github 的官方文档 Adding a new SSH key to your GitHub account 已经图文并茂将如何在 Github
帐号中添加 SSH 介绍的非常清楚了。先是在 Git Bash 中将 SSH Key 拷贝出来：

$ clip < ~/.ssh/id_rsa.pub
$ #Copies the contents of the id_rsa.pub file to your clipboard

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-UfoiqYXF-1576048944482)(Hexo搭建博客/7-5.png)]
id_rsa 是你刚才的 SSH Key 文件。此时，SSH Key 已经在我们的剪切板里了。然后登录 Github 帐号，依次点击自己的头像，Settings，SSH and GPG keys，New SSH key 或者 Add SSH key，在 Title 这里输入 Key 的label，比如 your_name - PC，然后在 Key 里面把 SSH Key 粘贴进去，点击 Add SSH key 大功告成。
我们做了身份认证的凭证 SSH key，分别放在自己本地电脑和 Github 服务器上，以后向 Github 提交内容的时候，两者的 Key 匹配就可以了，不需要每次输密码。

7.4.4 测试 SSH 连接

在大功告成之前，为了稳妥起见，我们来测试一下自己跟 Github 服务器 SSH 连接是否已经建立起来了。Github 的官方文档 Testing your SSH connection 将这个环节介绍得非常详细。我们要做得就是在 Git Bash 中敲入

$ ssh -T git@github.com

你可能会看到类似于
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-1Jy5SIAv-1576048944483)(Hexo搭建博客/7-6.png)]
没关系，输入 yes 敲回车，就可以看到如下的成功信息了
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-G0V3gFLK-1576048944485)(Hexo搭建博客/7-7.png)]
至此为止，我们已经建立起了跟 Github 服务器的连接。其实我们也可以用 git push 命令，提交 public 文件夹下面的内容，不过 Hexo 更我们提供了更方便的途径。

7.5 Hexo 部署

Hexo 提供了 hexo deploy 命令，可以方便地将整个 public 文件夹部署到 Github 服务器上去。根据 Hexo 的官方文档基本操作 — 部署我们只需要做以下两步：

7.5.1: 在终端中运行如下命令，安装 hexo-deployer-git 插件：

$ npm install hexo-deployer-git --save

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-KZlTj2Op-1576048944488)(Hexo搭建博客/7-8.png)]

7.5.2: 在 _config.yml 中修改参数，如下所示：

deploy:
type: git
repo: https://github.com/simpleai/simpleai.github.io.git
branch: master
其中，your_name 是你的 Github 帐号名。repo 对应的是你 your_name.github.io 这个项目的库（Repository）地址，进入这个项目的主页，点击 Clone or download 下拉菜单也能看到。branch 是分支名称，如果使用的是 GitHub 或 GitCafe 的话，程序会尝试自动检测，通常都是 master。注意，repo冒号后的空格非常重要，一定要有！
至此，在终端执行

hexo d -g

就可以把我们的本地文件部署到 Github 服务器上。在第一次部署的时候，Github 还会跳出来一个小窗口，让输入 Github 帐号和密码，输入即可。等待 20分钟的样子，就可以通过 your_name.github.io （your_name 是你的 Github 用户名）来访问自己的网站了。

8.独立域名与GitHub域名绑定

8.1阿里云购买域名

8.2解析域名

在cmd命令框中ping自己的博客网址(联网状态下)，ping yourname.github.io如下命令：

ping simpleai.github.io

得到数字地址如：151.101.73.147
在域名解析中添加两条记录：我这里设置了一个三级域名blog，
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-Yw20wnOb-1576048944489)(Hexo搭建博客/8-1.png)]
www 指定的记录是你在 github 创建的仓库。
如博客不能登录，有可能是 github 更改了空间服务的 ip 地址，记得及时查看最新的ip即可

8.3更改博客对应的域名

点击右上角Settings
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-gT2jp7c9-1576048944491)(Hexo搭建博客/8-2.png)]
更改并保存自己的域名
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-PHsU1lSh-1576048944491)(Hexo搭建博客/8-3.png)]