hexo框架个人博客的搭建(面试加分！)

偏执的太偏执、 2023-02-20 07:22 1阅读 0赞

**目录**

1. 安装node.js

2. 安装Git

3. 安装hexo

4. 和github关联

1. GitHub创建仓库

2. 配置SSHkey添加到Github

3. 上传到Github所建仓库

4. 测试访问

5. 创建第一篇博客

6. 更换默认主题

--------------------

# 1. 安装node.js #

访问 [https://nodejs.org/en/][https_nodejs.org_en]

![img][]

![img][img 1]

点击运行，采用默认选项不停的next即可，安装完成后

Win + R 输入cmd，回车打开任务管理器，输入 **node -v** 和 **npm -v** 查看对应的版本信息，出现如下结果即安装成功

![image-20210414205257804][]

--------------------

# 2. 安装Git #

访问 [https://git-scm.com/downloads][https_git-scm.com_downloads]

![img][img 2]

选择对应的系统进行安装，这里是win10，选择windows

![img][img 3]

大家都是64位机了，选择如上Setup版本即可

下载后得到

![img][img 4]

双击运行进行安装

具体的安装操作可以看看这个[Windows系统Git安装教程][Windows_Git]

下载完成后，出现这三个软件

![img][img 5]

且鼠标右键，出现这几个选项

![img][img 6]

--------------------

# 3. 安装hexo #

首先在任意地方新建一个文件夹，随意命名，比如这里命名为“我的博客”

![img][img 7]

（注意！我前面新建的文件夹是示范用的，实际上我操作的是/d/MyBlog文件夹）

![img][img 8]![20210414210834126.gif][]

接下来有有五部操作，大家仔细操作噢！

# 1. 安装hexo的基础框架
    npm install -g hexo

![img][img 9]

# 2.初始化hexo框架
    hexo init

![img][img 10]

# 3.安装所需要的组件
    npm install

![img][img 11]

# 4.编译生成静态页面
    hexo g

![img][img 12]![2021041421083449.gif][]

# 5.启动本地服务
    hexo s

![img][img 13]

这时候大家就可以访问了，默认访问地址是[http://localhost:4000][http_localhost_4000]

可能会出现不能访问的情况，原因是4000端口被占用，换一个端口就好了，这里换成5555可用

# 切换端口
    hexo s -p 5555

![image-20210414205834170][]

然后访问即可成功

![img][img 14]

--------------------

# 4. 和github关联 #

## 1. GitHub创建仓库 ##

Github中新建一个仓库

![img][img 15]

创建成功后，在git bash中，配置github账户信息，分别输入以下两条指令

git config --global user.name "yourname"
    
    git config --global user.email "youremail"

![img][img 16]![2021041421083484.gif][]

yourname就是你github的用户名，youremail就是你的邮箱

注意：这一步可能会 "user.name has multiple values"的问题

$ git config --global user.name *******
    warning: user.name has multiple values
    error: cannot overwrite multiple values with a single value
           Use a regexp, --add or --replace-all to change user.name.

这时候我们可以输入 git config --list 查看详细信息

![img][img 17]![2021041421083470.gif][]

你可能会发现最下方你有多个user.name或者多个user.email ，这就是问题所在

这时候用以下两个命令重新设置一下即可成功！！

git config --global --replace-all user.email "输入你的邮箱" 
    
    git config --global --replace-all user.name "输入你的用户名"

最后可以再使用 git config --list 验证一下

看到用户名和邮箱正确即成功！！

--------------------

## 2. 配置SSHkey添加到Github ##

回到gitbash中，输入

ssh-keygen -t rsa -C "你的邮箱"

![image-20210414210113126][]![20210414210834125.gif][]

注意其中的C是大写！！不是小写！！如果用小写会出现以下情况！！

![img][img 18]

成功后，出现如下情况：

![img][img 19]

这是问你哪里保存这个key文件，回车即可，后面一直回车，直到如图所示情况

![img][img 20]![20210414210834128.gif][]

然后我们回到GitHub中，点击settings

![img][img 21]![20210414210834130.gif][]

然后点击SSH and GPG keys

![img][img 22]

然后点击New SSH key，进入到以下页面

![img][img 23]

我们首先回到gitbash输入如下命令 得到我们的key

cat ~/.ssh/id_rsa.pub

![img][img 24]

然后将我们复制的key放入中间部分，标题随意，完成后点击Add SSH key

![img][img 25]

看到上图即添加成功！！！

然后我们再gitbash中输入

ssh -T git@github.com

进行验证！！如下图所示即成功

![img][img 26]

--------------------

## 3. 上传到Github所建仓库 ##

然后我们打开我们最开始新建的文件夹，用记事本打开\_config.yml文件

![img][img 27]

修改这个文件，如下图所示，保存退出

![img][img 28]

然后我们将其上传到Github上

首先再gitbash中输入

npm install hexo-deployer-git --save

然后依次执行以下三个命令

hexo clean
    
    hexo generate
    
    hexo deploy

如下图所示即成功

![img][img 29]![20210414210834202.gif][]

然后我们可以看到我们Github中新建的库中多了一些内容

![img][img 30]

这时候我们就上传成功了！！！！

## 4. 测试访问 ##

在浏览器中输入 [http://yourgithubname.github.io][http_yourgithubname.github.io] 访问

![img][img 31]

--------------------

# 5. 创建第一篇博客 #

回到git bash，输入 **hexo n "你创建博客的文件名"**

![img][img 32]![20210414210834163.gif][]

然后我们就可以看到在该目录下生成了你刚新建的.md文件

![img][img 33]

然后我们自己的编辑器打开这个文件，这里用Typora打开

![img][img 34]

进行简单的编辑

![img][img 35]![20210414210834233.gif][]

然后我们用**hexo clean**命令清理一下，在用**hexo g**命令生成

![img][img 36]![20210414210834181.gif][]

可以看到我们新生成的文件~~

然后我们`hexo s`启动一下

![img][img 37]![20210414210834148.gif][]

我们进入url访问

![img][img 38]

可以看到已经新生成了博客！！不过这时候只能通过本地端口打开，想要用我们前面部署到的Github的那个url打开，还得上传到我们的Github上去，按照前面第四大点所讲的，仪次输入三个命令

hexo clean
    hexo generate
    hexo deploy

成功后，我们在浏览器输入 [http://yourgithubname.github.io][http_yourgithubname.github.io] ，就可以发现我们新建的博客了~

![img][img 39]

到此为止已经成功创建好我们自己的博客！

--------------------

# 6. 更换默认主题 #

官方的主题网站：[https://hexo.io/themes/][https_hexo.io_themes]

这里推荐一个我觉得不错的主题 [https://github.com/litten/hexo-theme-yilia][https_github.com_litten_hexo-theme-yilia]

![img][img 40]

要换成这个主题，首先我们进行下载，打开git bash，输入以下命令克隆该主题文件到themes文件夹下的yilia文件里

git clone https://github.com/litten/hexo-theme-yilia.git themes/yilia

![img][img 41]

然后我们看到了下载下来的文件夹

![img][img 42]

然后我们修改配置文件\_config.yml,将主题名换为新的主题

![img][img 43]

保存退出

同样再仪次执行以下三个命令

hexo clean
    hexo generate
    hexo s

然后我们打开本地端口的url

![img][img 44]

发现主题已经更改

最后我们输入`hexo d` 上传到Github即可

这里放上一个可能出现问题的解决方案：[Hexo Git部署警告"warning： LF will be replaced by CRLF"的去除方法][Hexo Git_warning_ LF will be replaced by CRLF]

最后我们打开 [http://yourgithubname.github.io][http_yourgithubname.github.io]

![img][img 45]

注意！！上述所有过程可能不会立即生效，大家耐心等待~~

[https_nodejs.org_en]: https://nodejs.org/en/
[img]: https://img-blog.csdnimg.cn/20200624165205639.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQ1MTczNDA0,size_16,color_FFFFFF,t_70
[img 1]: https://img-blog.csdnimg.cn/2020062416522036.png
[image-20210414205257804]: https://img-blog.csdnimg.cn/img_convert/42b38d5d221088bb5c2834ac631574ce.png
[https_git-scm.com_downloads]: https://git-scm.com/downloads
[img 2]: https://img-blog.csdnimg.cn/20200624165426251.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQ1MTczNDA0,size_16,color_FFFFFF,t_70
[img 3]: https://img-blog.csdnimg.cn/20200624165441274.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQ1MTczNDA0,size_16,color_FFFFFF,t_70
[img 4]: https://img-blog.csdnimg.cn/20200624165501193.png
[Windows_Git]: https://www.cnblogs.com/xueweisuoyong/archive/2019/11/22/11914045.html
[img 5]: https://img-blog.csdnimg.cn/20200624165545422.png
[img 6]: https://img-blog.csdnimg.cn/20200624165558729.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQ1MTczNDA0,size_16,color_FFFFFF,t_70
[img 7]: https://img-blog.csdnimg.cn/20200624165703603.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQ1MTczNDA0,size_16,color_FFFFFF,t_70
[img 8]: https://img-blog.csdnimg.cn/20200624165717558.png
[20210414210834126.gif]: https://img-blog.csdnimg.cn/20210414210834126.gif
[img 9]: https://img-blog.csdnimg.cn/20200624165824596.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQ1MTczNDA0,size_16,color_FFFFFF,t_70
[img 10]: https://img-blog.csdnimg.cn/20200624170028721.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQ1MTczNDA0,size_16,color_FFFFFF,t_70
[img 11]: https://img-blog.csdnimg.cn/20200624170105420.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQ1MTczNDA0,size_16,color_FFFFFF,t_70
[img 12]: https://img-blog.csdnimg.cn/20200624170145865.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQ1MTczNDA0,size_16,color_FFFFFF,t_70
[2021041421083449.gif]: https://img-blog.csdnimg.cn/2021041421083449.gif
[img 13]: https://img-blog.csdnimg.cn/20200624170218856.png
[http_localhost_4000]: http://localhost:4000
[image-20210414205834170]: https://img-blog.csdnimg.cn/img_convert/7215474cb287e2862b7fb2da2729a8a0.png
[img 14]: https://img-blog.csdnimg.cn/20200624170400457.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQ1MTczNDA0,size_16,color_FFFFFF,t_70
[img 15]: https://img-blog.csdnimg.cn/20200624170508897.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQ1MTczNDA0,size_16,color_FFFFFF,t_70
[img 16]: https://img-blog.csdnimg.cn/20200624170631798.png
[2021041421083484.gif]: https://img-blog.csdnimg.cn/2021041421083484.gif
[img 17]: https://img-blog.csdnimg.cn/20200624171102188.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQ1MTczNDA0,size_16,color_FFFFFF,t_70
[2021041421083470.gif]: https://img-blog.csdnimg.cn/2021041421083470.gif
[image-20210414210113126]: https://img-blog.csdnimg.cn/img_convert/73a4daf5baeb89f8a2454a16cab13492.png
[20210414210834125.gif]: https://img-blog.csdnimg.cn/20210414210834125.gif
[img 18]: https://img-blog.csdnimg.cn/20200624171625116.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQ1MTczNDA0,size_16,color_FFFFFF,t_70
[img 19]: https://img-blog.csdnimg.cn/20200624171706706.png
[img 20]: https://img-blog.csdnimg.cn/20200624171744988.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQ1MTczNDA0,size_16,color_FFFFFF,t_70
[20210414210834128.gif]: https://img-blog.csdnimg.cn/20210414210834128.gif
[img 21]: https://img-blog.csdnimg.cn/20200624171823626.png
[20210414210834130.gif]: https://img-blog.csdnimg.cn/20210414210834130.gif
[img 22]: https://img-blog.csdnimg.cn/20200624171836210.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQ1MTczNDA0,size_16,color_FFFFFF,t_70
[img 23]: https://img-blog.csdnimg.cn/20200624171924626.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQ1MTczNDA0,size_16,color_FFFFFF,t_70
[img 24]: https://img-blog.csdnimg.cn/20200624172030964.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQ1MTczNDA0,size_16,color_FFFFFF,t_70
[img 25]: https://img-blog.csdnimg.cn/20200624172053469.png
[img 26]: https://img-blog.csdnimg.cn/20200624172134354.png
[img 27]: https://img-blog.csdnimg.cn/2020062417220894.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQ1MTczNDA0,size_16,color_FFFFFF,t_70
[img 28]: https://img-blog.csdnimg.cn/20200624172309697.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQ1MTczNDA0,size_16,color_FFFFFF,t_70
[img 29]: https://img-blog.csdnimg.cn/20200624172547537.png
[20210414210834202.gif]: https://img-blog.csdnimg.cn/20210414210834202.gif
[img 30]: https://img-blog.csdnimg.cn/20200624172559582.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQ1MTczNDA0,size_16,color_FFFFFF,t_70
[http_yourgithubname.github.io]: http://yourgithubname.github.io
[img 31]: https://img-blog.csdnimg.cn/20200624172712227.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQ1MTczNDA0,size_16,color_FFFFFF,t_70
[img 32]: https://img-blog.csdnimg.cn/20200625090322399.png
[20210414210834163.gif]: https://img-blog.csdnimg.cn/20210414210834163.gif
[img 33]: https://img-blog.csdnimg.cn/2020062509034185.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQ1MTczNDA0,size_16,color_FFFFFF,t_70
[img 34]: https://img-blog.csdnimg.cn/20200625090400600.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQ1MTczNDA0,size_16,color_FFFFFF,t_70
[img 35]: https://img-blog.csdnimg.cn/20200625090418184.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQ1MTczNDA0,size_16,color_FFFFFF,t_70
[20210414210834233.gif]: https://img-blog.csdnimg.cn/20210414210834233.gif
[img 36]: https://img-blog.csdnimg.cn/20200625090459441.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQ1MTczNDA0,size_16,color_FFFFFF,t_70
[20210414210834181.gif]: https://img-blog.csdnimg.cn/20210414210834181.gif
[img 37]: https://img-blog.csdnimg.cn/20200625090523157.png
[20210414210834148.gif]: https://img-blog.csdnimg.cn/20210414210834148.gif
[img 38]: https://img-blog.csdnimg.cn/20200625090532843.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQ1MTczNDA0,size_16,color_FFFFFF,t_70
[img 39]: https://img-blog.csdnimg.cn/20200625090718592.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQ1MTczNDA0,size_16,color_FFFFFF,t_70
[https_hexo.io_themes]: https://hexo.io/themes/
[https_github.com_litten_hexo-theme-yilia]: https://github.com/litten/hexo-theme-yilia
[img 40]: https://img-blog.csdnimg.cn/20200625095025785.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQ1MTczNDA0,size_16,color_FFFFFF,t_70
[img 41]: https://img-blog.csdnimg.cn/20200625095052492.png
[img 42]: https://img-blog.csdnimg.cn/20200625095104369.png
[img 43]: https://img-blog.csdnimg.cn/20200625095119587.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQ1MTczNDA0,size_16,color_FFFFFF,t_70
[img 44]: https://img-blog.csdnimg.cn/20200625095154287.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQ1MTczNDA0,size_16,color_FFFFFF,t_70
[Hexo Git_warning_ LF will be replaced by CRLF]: https://gaomf.cn/2017/01/13/Hexo_Git_CRLF/
[img 45]: https://img-blog.csdnimg.cn/20200625095226109.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQ1MTczNDA0,size_16,color_FFFFFF,t_70