Hexo零基础搭建个人博客(详解)

✅作者简介：CSDN内容合伙人、信息安全专业在校大学生
系列专栏 ：零基础搭建个人网站
新人博主 ：欢迎点赞收藏关注，会回访！
个人格言：舞台再大，你不上台，永远是个观众。平台再好，你不参与，永远是局外人。能力再大，你不行动，只能看别人成功！没有人会关心你付出过多少努力，撑得累不累，摔得痛不痛，他们只会看你最后站在什么位置，然后羡慕或鄙夷。

---

Hexo + Github零基础搭建基础的，免费的个人网站

第一部分：安装教程

1. 安装Git

安装过程跳过，测试是否安装成功git -v

2. 安装Node.js

安装过程跳过，测试是否安装成功node -v

3. 安装hexo

1. 在安装目录下输入命令

npm install -g hexo-cli

#安装成功输出：
added 59 packages, and audited 60 packages in 10s

15 packages are looking for funding
  run `npm fund` for details

found 0 vulnerabilities

2. 测试是否安装成功hexo -v
3. 初始化hexo

hexo init myblog  # myblog是您想设置的文件名 

成功之后输出：
INFO  Cloning hexo-starter https://github.com/hexojs/hexo-starter.git
INFO  Install dependencies
INFO  Start blogging with Hexo!

4. 进入该文件夹，cd myblog 然后执行命令npm install自动安装依赖。

cd myblog
npm install


up to date, audited 240 packages in 2s

22 packages are looking for funding
  run `npm fund` for details

found 0 vulnerabilities

安装结果如下：

• node_modules: 依赖包
• public：存放生成的页面
• scaffolds：生成文章的一些模板
• source：用来存放你的文章
• themes：主题
• _config.yml: 博客的配置文件

5. 启动hexo服务

hexo g
hexo server  //hexo s

打开hexo的服务，在浏览器输入localhost:4000就可以看到你生成的博客了。如下图，使用Ctrl + C 就可以关闭

4. GitHub创建个人仓库

首先，你先要有一个GitHub账户，去注册一个吧。
注册完登录后，在GitHub.com中看到一个New repository，新建仓库

创建一个和你用户名相同的仓库，后面加.github.io，只有这样，将来要部署到GitHub page的时候，才会被识别，也就是xxxx.github.io，其中xxx就是你注册GitHub的用户名。我这里是已经建过了。

然后点击 create repository。

5. 生成SSH添加到GitHub

打开刚才的myblog的文件目录，在空白地方鼠标右键，点击Git Bash Here

设置 Git 的用户名和邮箱

git config --global user.name "你的GitHub用户名"
git config --global user.email "你的GitHub邮箱"

这里的yourname输入你的GitHub用户名，youremail输入你GitHub的邮箱。这样GitHub才能知道你是不是对应它的账户。
可以用以下两条，检查一下你有没有输对

git config user.name
git config user.email

然后创建SSH,一路回车
ssh-keygen -t rsa -C "youremail"

这个时候它会告诉你已经生成了.ssh的文件夹。在你的电脑中找到这个文件夹。

ssh，简单来讲，就是一个秘钥，其中，id_rsa是你这台电脑的私人秘钥，不能给别人看的，id_rsa.pub是公共秘钥，可以随便给别人看。把这个公钥放在GitHub上，这样当你链接GitHub自己的账户时，它就会根据公钥匹配你的私钥，当能够相互匹配时，才能够顺利的通过git上传你的文件到GitHub上。
而后在GitHub的setting中，找到SSH keys的设置选项，点击New SSH key
把你的id_rsa.pub里面的信息复制进去,名字随便起。


之后Git命令行输入ssh -T [email protected] 测试是否成功

6. 将hexo部署到GitHub

这一步，我们就可以将hexo和GitHub关联起来，也就是将hexo生成的文章部署到GitHub上，打开站点配置文件 _config.yml
翻到最后，修改下面代码的YourgithubName为你的GitHub账户的用户名.注意修改文件配置的时候，因为是YAML风格，所以冒号后面有一个空格！

deploy:
  type: git
  repo: https://github.com/YourgithubName/YourgithubName.github.io.git
  branch: main

这个时候需要先安装deploy-git ，也就是部署的命令,这样你才能用命令部署到GitHub。npm install hexo-deployer-git --save

成功之后输出：

added 1 package, and audited 241 packages in 3s

22 packages are looking for funding
  run `npm fund` for details

found 0 vulnerabilities

然后

hexo clean
hexo generate  # hexo g
hexo deploy  # hexo d

其中 hexo clean清除了你之前生成的东西，也可以不加。
hexo generate 顾名思义，生成静态文章，可以用 hexo g缩写
hexo deploy 部署文章，可以用hexo d缩写
注意deploy时可能要你输入username和password。
得到下图就说明部署成功了，过一会儿就可以在http://yourname.github.io 这个网站看到你的博客了！！

接下来你就可以正式开始写文章了。
hexo new newpapername
然后在source/_post中打开markdown文件，就可以开始编辑了。当你写完的时候，再

hexo clean
hexo g
hexo d

就可以看到更新了。

第二部分： hexo的基本配置

1. hexo基本配置

在文件根目录下的_config.yml，就是整个hexo框架的配置文件了。可以在里面修改大部分的配置。详细可参考官方的配置描述。

网站

参数	描述
title	网站标题
subtitle	网站副标题
description	网站描述
author	您的名字
language	网站使用的语言
timezone	网站时区。Hexo 默认使用您电脑的时区。时区列表
。比如说：America/New_York, Japan, 和 UTC 。

其中，description主要用于SEO，告诉搜索引擎一个关于您站点的简单描述，通常建议在其中包含您网站的关键词。author参数用于主题显示文章的作者。

网址

参数	描述
url	网址
root	网站根目录
permalink	文章的 永久链接
格式
permalink_defaults	永久链接中各部分的默认值

在这里，你需要把url改成你的网站域名。
permalink，也就是你生成某个文章时的那个链接格式。
比如我新建一个文章叫temp.md，那么这个时候他自动生成的地址就是http://yoursite.com/2018/09/05/temp。
以下是官方给出的示例，关于链接的变量还有很多，需要的可以去官网上查找 永久链接 。

参数	结果
:year/:month/:day/:title/	2013/07/14/hello-world
:year-:month-:day-:title.html	2013-07-14-hello-world.html
:category/:title	foo/bar/hello-world

再往下翻，中间这些都默认就好了。

theme: landscape

# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
 type: git
 repo: 
 branch: [branch]

theme就是选择什么主题，也就是在theme这个文件夹下，在官网上有很多个主题，默认给你安装的是lanscape这个主题。当你需要更换主题时，在官网上下载，把主题的文件放在theme文件夹下，再修改这个参数就可以了。
接下来这个deploy就是网站的部署的，repo就是仓库(Repository)的简写。branch选择仓库的哪个分支。这个在之前进行github page部署的时候已经修改过了，不再赘述。而这个在后面进行双平台部署的时候会再次用到。

Front-matter

Front-matter 是文件最上方以 — 分隔的区域，用于指定个别文件的变量，举例来说：

title: Hello World
date: 2013/7/13 20:46:25
---

下是预先定义的参数，您可在模板中使用这些参数值并加以利用。

参数	描述
layout	布局
title	标题
date	建立日期
updated	更新日期
comments	开启文章的评论功能
tags	标签（不适用于分页）
categories	分类（不适用于分页）
permalink	覆盖文章网址

其中，分类和标签需要区别一下，分类具有顺序性和层次性，也就是说 Foo, Bar 不等于 Bar, Foo；而标签没有顺序和层次。

categories:
 - Diary
 tags:
 - PS3
 - Games

layout（布局）

当你每一次使用代码

hexo new paper

它其实默认使用的是post这个布局，也就是在source文件夹下的_post里面。
Hexo 有三种默认布局：post、page 和 draft，它们分别对应不同的路径，而您自定义的其他布局和 post 相同，都将储存到 source/_posts 文件夹。

布局	路径
post	source/_posts
page	source
draft	source/_drafts

而new这个命令其实是：

hexo new [layout]