【Hexo+github博客搭建教程】

zrh_023

已于 2022-12-22 23:07:30 修改

阅读量261

点赞数

文章标签： git github

于 2022-12-22 23:06:05 首次发布

本文链接：https://blog.csdn.net/qq_45785236/article/details/128414338

版权

Preface

搭建这个博客的目的是想把自己学习的笔记、读书的笔记等等存到云端，相当于一个笔记本的作用，当然了，搭建博客的过程也可以让给我学到很多东西。我想很多小伙伴也想搭建一个属于自己的博客吧，那我就在此稍稍总结一下具体的搭建过程，更多的个性化设置还需要你自己去摸索。

最后，这个hexo博客的搭建是基于windows 11系统的，各位小伙伴可以作为参考。

1.小知识

搭建之前，你需要了解一下我们搭建博客需要用到的框架。

什么是Hexo？

Hexo 是一个快速、简洁且高效的博客框架。Hexo 使用 Markdown（或其他渲染引擎）解析文章，在几秒内，即可利用靓丽的主题生成静态网页。它是基于Node.js的。

现在来介绍Hexo的命令

hexo n "我的博客" == hexo new "我的博客" #新建文章
hexo g == hexo generate #生成
hexo s == hexo server #启动服务预览
hexo d == hexo deploy #部署
hexo clean #清除缓存

什么是Node.js?

Node.js发布于2009年5月，由Ryan Dahl开发，是一个基于Chrome V8引擎的JavaScript运行环境，使用了一个事件驱动、非阻塞式I/O模型，让JavaScript 运行在服务端的开发平台，它让JavaScript成为与PHP、Python、Perl、Ruby等服务端语言平起平坐的脚本语言。

什么是Git?

Git（读音为/gɪt/）是一个开源的分布式版本控制系统，可以有效、高速地处理从很小到非常大的项目版本管理。 [1] 也是Linus Torvalds为了帮助管理Linux内核开发而开发的一个开放源码的版本控制软件。

什么是GitHub？

GitHub是一个面向开源及私有软件项目的托管平台，因为只支持Git作为唯一的版本库格式进行托管，故名GitHub。

2.开始搭建

在开始搭建之前，我们需要先安装下列应用：

1.Node.js

2.Git

2.1安装Node.js

百度搜索Node.js，进入官网下载长期维护版本，这里附上链接[Node.js](Node.js (nodejs.org))

安装选项全部点默认就行，一路next。最后安装好了之后打开命令提示符

win+R,输入node -v和npm -v如果出现版本号，那么恭喜你，安装成功了！

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-GhIj7g8h-1671718556851)(https://cdn.jsdelivr.net/gh/zrhcode/CDN-jsDeliver@1.0/Hexo-Github博客搭建教程/image-20220124203355332.png)]

2.2注册Github账号

GitHub,点此进行注册，注册完成后，右上角点击+号新建一个仓库New repository如下图所示[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-TeLN2Pdn-1671718556854)(https://cdn.jsdelivr.net/gh/zrhcode/Pictures/Img/20220125214717.png)]

2.3安装Git

百度搜索git官网下载，这里附上链接Git，安装时还是选择默认，最后一步添加路径时选择Use Git from the Windows Command Prompt，安装完成后在命令提示符输入git --version来看看你是否安装成功！找到你的Git安装路径D:\ProgramFiles\Git打开git-bash.exe，打开git的控制台窗口，以后我们所有的操作都在git控制台进行.

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-JpEpChlq-1671718556854)(https://cdn.jsdelivr.net/gh/zrhcode/Pictures/Img/20220125214727.png)]

打开Git Bash，设置user.name和user.email配置信息：

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

生成ssh密钥文件：

ssh-keygen -t rsa -C "你的GitHub注册邮箱"然后一直回车就行了，接着找到.ssh中的id_rsa.pub密钥，我的如图所示

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-5FllvOH3-1671718556855)(https://cdn.jsdelivr.net/gh/zrhcode/Pictures/Img/20220125214735.png)]

打开GitHub-Settings-keys，新建new SSH Key,Title为标题，任意填即可，将刚刚复制的id_rsa.pub内容粘贴进去，最后点击Add SSH key。在Git Bash中检测GitHub公钥设置是否成功，输入 ssh git@github.com ,这里之所以设置GitHub密钥原因是，通过非对称加密的公钥与私钥来完成加密，公钥放置在GitHub上，私钥放置在自己的电脑里。GitHub要求每次推送代码都是合法用户，所以每次推送都需要输入账号密码验证推送用户是否是合法用户，为了省去每次输入密码的步骤，采用了ssh，当你推送的时候，git就会匹配你的私钥跟GitHub上面的公钥是否是配对的，若是匹配就认为你是合法用户，则允许推送。这样可以保证每次的推送都是正确合法的。

2.4添加淘宝镜像源

在终端输入npm install -g cnpm --registry=https://registry.npm.taobao.org

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-lYXMxBga-1671718556855)(https://cdn.jsdelivr.net/gh/zrhcode/Pictures/Img/20220125214743.png)]

最后输入cnpm -v来看一下版本，看是否安装成功。

2.5安装Hexo博客框架

首先新建一个博客文件夹，用来存放自己的博客文件，我的是这样的D:\ProgramFiles\Blog\zrhcode。在git控制台输入cnpm install -g hexo-cli安装博客框架，接着输入hexo -v检查是否安装成功

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-OCE6KIh7-1671718556856)(https://cdn.jsdelivr.net/gh/zrhcode/Pictures/Img/20220125214748.png)]

切换到你刚新建的blog目录下,如D:\ProgramFiles\Blog\zrhcode,来生成博客目录，在git控制台输入hexo init初始化文件夹。这样hexo就安装好了。

打开你新建的blog目录D:\ProgramFiles\Blog\zrhcode，你会发现多了许多文件夹，在blog根目录下有个_config.yml，这个叫站点配置文件,在themes文件夹里D:\ProgramFiles\Blog\zrhcode\themes\landscape下有个文件夹 _config.yml，这个叫主题配置文件。

下一步将我们的Hexo与GitHub关联起来，打开站点的配置文件_config.yml，翻到最后修改为

deploy:
type: git #注意冒号后空一格
repo: https://github.com/username/username.github.io.git #username改为你自己创建的名字
branch: master

接下来，我们保存站点配置文件，其实就是给hexo d 这个命令做相应的配置，让hexo知道你要把blog部署在哪个位置，很显然，我们部署在我们GitHub的仓库里。cnpm install hexo-deployer-git --save,这时，我们输入以下命令：

hexo clean #清理本地缓存
hexo g #生成本地文件
hexo d #部署到远端，这个由于网速原因，可能会失败，多试几次就好了

然后你就可以访问你个人的博客了，如xxxx.github.io，我的时zrhcode.github.io

接下来，就来启动我们的博客，输入hexo s,然后再浏览器打开http://localhost:4000/

2.6配置主题

2.6.1更换主题

landscape是hexo默认的主题，可以更换不同的主题，个人比较推荐的主题有三个：①NexT （排行榜第一，使用的人非常多，很火爆，以简约为主）②yilia（使用的人也很多，左右排版，很好看）③Butterfly（具体没用过，这个受众也挺多的），之所以推荐这些，是因为这些主题比较火爆，所以网上有好多配置教程，你可以百度搜索，配置出自己喜欢的风格。当然了你也可以去hexo-themes下挑选自己喜欢的主题Themes | Hexo

接下来，说说怎么更换主题（其实，博主并不是在搭建博客上耗费了很多时间，而是在配置主题方面花了大量时间，这才导致用了一个星期[手动狗头]），在Git中先切换到新建的blog目录，然后输入git clone https//github.com/litten/hexo-theme-yilia.git themes/yilia这是将yilia主题下载到blog目录的themes主题下的yilia文件夹中。

用记事本打开站点的_config.yml配置文件，修改主题为yilia

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-LRaGXS5p-1671718556856)(https://cdn.jsdelivr.net/gh/zrhcode/Pictures/Img/20220125214757.png)]

修改好后保存，再次部署网站

hexo clean 
hexo g
hexo s
hexo d

到这里我们的博客就搭建完了，剩下具体的主题配置就需要你自己去搞了。

2.6.2配置主题

这里放一些我在配置过程中找到的文章及视频，希望对你有所帮助：

1.一步一步教你如何在Windows10上完成hexo博客搭建和yilia主题使用_哔哩哔哩_bilibili

2.https://joeybling.github.io/

3.http://dongshuyan.com/2019/05/24/hexo%E5%8D%9A%E5%AE%A2%E6%B3%A8%E6%84%8F%E4%BA%8B%E9%A1%B9/

2.7 写博客

在你的博客目录下右键打开Git Bash Here，然后输入hexo new “博客文章的题目”，点击回车，可以看到文章创建的位置，如图所示，接下来，你就可以在你创建的Markdown文件中写博客啦。如果你不太会用Markdown写博客，可以参考我的另一篇文章：Markdown基本语法 | 新世界 (zrhcode.github.io)