搭建Hexo个人博客详细教程

港控/mmm° 2023-02-14 00:29 6阅读 0赞

##### 写在前面的话 #####

很早以前就想要搭建一个个人的博客，奈何只是一个前端切图仔，对于后端和数据库接口上手存在一定的难度，于是一拖拖了很久，今天无意中发现了使用Hexo搭建个人博客很快就能用了，而且托管在github平台也不需要自己去买服务器域名和维护，一举数得，非常nice，记录了一下搭建Hexo个人博客的步骤，尽可能的写的详细一点~

##### 准备工作步骤 #####

1：GitHub上面新建一个仓库，用来放自己的博客  
2：安装git工具，生成SSH添加到GitHub  
3：本地环境搭建，安装node 和npm  
4：本地初始化Hexo项目并且运行  
5：Hexo主题  
6：部署到github  
7：生成markdown文件，写文章并且发布

言归正传，开始我们的写作步骤吧

##### 一：在GitHub上面新建一个仓库，用来放自己的博客 #####

1：新建一个仓库  
创建一个和你用户名相同的仓库，后面加.github.io后缀，必须要同名哦，不然后面会出现页面404的情况，点击create respository按钮创建。

![format_png][]

2：安装git工具，生成SSH添加到GitHub  
安装git工具这里就不多说了，安装完成之后，在桌面上git bash进入命令行，输入GitHub用户名和邮箱验证。

yourname输入你的GitHub用户名
    youremail输入你GitHub的邮箱

![format_png 1][]

查看输入是否正确  
![format_png 2][]

3：然后创建SSH，一路回车

ssh-keygen -t rsa -C "xxxx7537@qq.com"(你的邮箱）

![format_png 3][]

这个时候可以看到在磁盘里面生成了私人密钥和公共密钥了  
![format_png 4][]

4：在GitHub上设置密钥  
在GitHub的setting中，找到Deploy keys的设置选项，点击新建一个密钥，把id\_rsa.pub里面的信息复制进去，id\_rsa.pub打开方式可以使用浏览器打开。  
![format_png 5][]

![format_png 6][]

新建密钥成功，到这里github仓库和密钥问题就OK了。  
![format_png 7][]

##### 二：Hexo搭建个人博客-框架的本地安装和运行 #####

1：Hexo的官网  
https://hexo.io/

2：安装node 和npm  
hexo基于node.js，本地需要安装node 和npm，安装步骤就不多说了  
查看一下是否有版本号，有的话则安装成功。  
![format_png 8][]

3：全局安装 hexo

npm  i  hexo-cli -g

![format_png 9][]  
4：初始化一个项目

hexo  init blog

![format_png 10][]  
这时候可以看到在d盘里面生成了一个文件夹。  
![format_png 11][]  
5：进入项目文件夹，安装依赖文件

cd  blog
    npm  install

![format_png 12][]  
6：运行，并且在浏览器打开，就可以看到博客页面了

hexo server

http://localhost:4000  
![format_png 13][]

![format_png 14][]

#### 三：更换一个自己喜欢的主题 ####

1：博客主题的安装  
主题这一块可以选择自己喜欢的，以下是以一个Anisina主题为例，这里有很多主题可以选择：传送门：https://hexo.io/themes/。比如选一个主题：https://github.com/haojen/hexo-theme-Anisina，打开链接，进入到GitHub里面，有详细的安装教程。  
![format_png 15][]

![format_png 16][]  
2：安装主题命令输入

git clone https://github.com/Haojen/hexo-theme-Anisina.git themes/Anisina

![format_png 17][]

3：打开`_config.yml`文件夹，更改主题名字  
![format_png 18][]

4：再次启动，就可以看到更换的主题了。  
![format_png 19][]  
![format_png 20][]  
OK，搭建好了自己喜欢的主题风格了，接下来需要部署了。

#### 四. 部署到github ####

1：在配置文件里面填写仓库地址  
在项目里面找到 \_congif.yml文件，找到 deploy 字段，把以下代码放进去，填写第一步新建的仓库地址。

# Deployment
    ## Docs: https://hexo.io/docs/deployment.html
    deploy:
    type: git
    repo: <你的仓库地址> # https://github.com/wangxiaoting666/wangxiaoting666.github.io.git
    branch: master

![format_png 21][]

2：安装一个推送工具，将本地项目推到仓库上。

npm install hexo-deployer-git --save

![format_png 22][]

![format_png 23][]  
3：然后执行以下命令  
清除了你之前生成的东西，也可以不加。

hexo clean

4：hexo generate 生成静态文件，可以用 hexo g缩写

hexo  g

![format_png 24][]

![format_png 25][]

可以看到在目录里面生成了一个静态的文件，生成好的public文件夹就直接当成静态网站进行部署即可。

5： 部署

hexo deploy

注意这里需要输入GitHub用户名和密码哦  
![图片.png][.png]

![format_png 26][]

6：查看仓库，已经将项目放在仓库里面了

![format_png 27][]  
这个时候就可以访问了，已经把静态文件都托管在GitHub了，查看分配的地址：[https://wangxiaoting666.github.io/][https_wangxiaoting666.github.io]

#### 五：开始写文章 ####

1：新建一个markdown文件

hexo new newpapername

![format_png 28][]  
在source\_posts里面生成了markdown文件夹，用来写文章了，记住要使用markdown格式书写文章博客。  
![format_png 29][]

![format_png 30][]

2：当你写完的时候，再输入命令

hexo clean
    hexo g
    hexo d

就可以看到新增的自己的文章了  
![format_png 31][]

3：如果要再写一篇，可以再生成一个md文件进行书写

hexo new test

![format_png 32][]  
4：好了，自己的博客搭建起来了，后面会慢慢的往里面增加一些文章，以及接入评论系统，统计文章阅读量，代码高亮，图床等功能。

参考文档：https://blog.csdn.net/sinat\_37781304/article/details/82729029

![>欢迎关注【编程微刊】公众号，回复【领取资源】,500G编程学习资源干货免费送。][500G]

[format_png]: https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy81NjQwMjM5LWM5Mjc2MWE0NWRkYzk3ZjIucG5n?x-oss-process=image/format,png
[format_png 1]: https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy81NjQwMjM5LTNmNWRjYmIwYmQxMjE1NWEucG5n?x-oss-process=image/format,png
[format_png 2]: https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy81NjQwMjM5LTc1OGNiNWQ2YjE4MTI2ZTkucG5n?x-oss-process=image/format,png
[format_png 3]: https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy81NjQwMjM5LTEzN2QwYTViZmU5YjRkMjEucG5n?x-oss-process=image/format,png
[format_png 4]: https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy81NjQwMjM5LTMwNjIwMjNiMmFkZmE2MDkucG5n?x-oss-process=image/format,png
[format_png 5]: https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy81NjQwMjM5LTczYTkyZTUwNzNjNWExZjYucG5n?x-oss-process=image/format,png
[format_png 6]: https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy81NjQwMjM5LWZmM2M2ZjNmMTdkYTRkN2EucG5n?x-oss-process=image/format,png
[format_png 7]: https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy81NjQwMjM5LTAxMDA2YzhlYmQxY2ZiMDMucG5n?x-oss-process=image/format,png
[format_png 8]: https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy81NjQwMjM5LThiY2RkYjY5YzkxNWJjOTIucG5n?x-oss-process=image/format,png
[format_png 9]: https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy81NjQwMjM5LTY0MDFkNmUxNmFmYzkwMmIucG5n?x-oss-process=image/format,png
[format_png 10]: https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy81NjQwMjM5LTYwZjhiOWQ1NjAyZjg5ODMucG5n?x-oss-process=image/format,png
[format_png 11]: https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy81NjQwMjM5LTUyY2Q3NjNiYWU3NDIzNjQucG5n?x-oss-process=image/format,png
[format_png 12]: https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy81NjQwMjM5LTYzODNlMjVhYzExOGY3YzgucG5n?x-oss-process=image/format,png
[format_png 13]: https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy81NjQwMjM5LWVjM2Y4ZDkzYmU5ZWEwZTYucG5n?x-oss-process=image/format,png
[format_png 14]: https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy81NjQwMjM5LTBmYjgwOTczYzQ5YjAyNTEucG5n?x-oss-process=image/format,png
[format_png 15]: https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy81NjQwMjM5LTg1YzMwMzg3YzIwZjNjMTMucG5n?x-oss-process=image/format,png
[format_png 16]: https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy81NjQwMjM5LTI5NmU1ODBiODA0MWJmNGUucG5n?x-oss-process=image/format,png
[format_png 17]: https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy81NjQwMjM5LWU3MjI1MTZkZDc0Y2U0NmMucG5n?x-oss-process=image/format,png
[format_png 18]: https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy81NjQwMjM5LTM0NDZhZTc0ZGZmODE2NDkucG5n?x-oss-process=image/format,png
[format_png 19]: https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy81NjQwMjM5LTYzODk1ZjQ5MjNhODdkNzQucG5n?x-oss-process=image/format,png
[format_png 20]: https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy81NjQwMjM5LThhZjlkYjYxYTM2ZWRhYmQucG5n?x-oss-process=image/format,png
[format_png 21]: https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy81NjQwMjM5LTMyNWYwMTYzOWMyZjYxZDgucG5n?x-oss-process=image/format,png
[format_png 22]: https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy81NjQwMjM5LTI1ZGQ2ZGFhNDk1Njc4MDIucG5n?x-oss-process=image/format,png
[format_png 23]: https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy81NjQwMjM5LWFlYjIxZTNiNjg3NDY5NzcucG5n?x-oss-process=image/format,png
[format_png 24]: https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy81NjQwMjM5LWI5MGYwNjEwODE3NjJmZjAucG5n?x-oss-process=image/format,png
[format_png 25]: https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy81NjQwMjM5LTdmMjRkZTY2OTI2NjVmNGQucG5n?x-oss-process=image/format,png
[.png]: https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy81NjQwMjM5LWZhNjg5MmRjMzlhNjBjY2YucG5n?x-oss-process=image/format,png
[format_png 26]: https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy81NjQwMjM5LTdmMDdhOTg1ODE3NTg3NGEucG5n?x-oss-process=image/format,png
[format_png 27]: https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy81NjQwMjM5LWQ3NzA0M2JlYTk4YjZiZDEucG5n?x-oss-process=image/format,png
[https_wangxiaoting666.github.io]: https://wangxiaoting666.github.io/
[format_png 28]: https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy81NjQwMjM5LTFlZjlhYTY3MDE2MjgzMjYucG5n?x-oss-process=image/format,png
[format_png 29]: https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy81NjQwMjM5LTZjNGNhY2UxY2M2NzZlMDUucG5n?x-oss-process=image/format,png
[format_png 30]: https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy81NjQwMjM5LWQ1MjA5MjUzMjMwNDc0OGYucG5n?x-oss-process=image/format,png
[format_png 31]: https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy81NjQwMjM5LWJlNGE0ODViZTQ0OTk5MzkucG5n?x-oss-process=image/format,png
[format_png 32]: https://imgconvert.csdnimg.cn/aHR0cHM6Ly91cGxvYWQtaW1hZ2VzLmppYW5zaHUuaW8vdXBsb2FkX2ltYWdlcy81NjQwMjM5LWU0ODZiYjI3Mjc4YWJiMDcucG5n?x-oss-process=image/format,png
[500G]: https://img-blog.csdnimg.cn/20200530000033821.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDc2MzU2OQ==,size_16,color_FFFFFF,t_70