Hexo博客搭建笔记

shuyepl 2021-10-27 01:41:52
Categories： > Tags：

第一篇博客

今天很开心，终于照着羊哥的视频，一步步搭建了自己的第一个博客。

以下内容是我搭建好这个博客之后很长时间再补充的，时间: 2022 年 / 5月 / 22日

下载安装 Node.js

Node.js 官网：Node.js (nodejs.org) 点击下图红色方框下载安装包，下载完成后点击安装包进行安装，接下来就一直 next 即可，中间有协议之类的东西要选择同意。

001

安装完成后，WIN + R 打开命令窗口，输入 node -v 查看 node 的版本号，如果输出结果如下，表示当前电脑安装的 node 的版本号为 16.15.0 ，安装成功。

002

然后再在命令行中输入 npm -v 查看 npm 包管理器的版本号，如果也是正确输出当前的版本号，那么到目前为止的工作就算完成了。

003

本来这里接下来就应该是利用 npm 包管理器来安装 Hexo 博客框架了，但是因为国内的访问速度较慢，所以，安装一下 cnpm（设置淘宝的镜像源，访问速度快），在命令行中输入 npm install -g cnpm –registry=https://registry.npm.taobao.org，等待安装即可，安装完成后输入 cnpm -v 查看 cnpm 的版本号，和前面的一样，正常显示版本号即表示安装完成。

004

安装 git

这个在羊哥的视频里面没有提到，但在后面使用命令时需要用到，不然会报错

010

git 下载地址：Git - Downloads (git-scm.com)

打开网站后点击下图红色方框的内容（我的系统是 Windows 的，所以选择 Windows 的，这个可以根据具体的系统环境选择相应系统的，下面的操作我都以 Windows 系统为例）

011

跳转到另外的一个网页，这里有很多版本可以下载，根据需要选择相应版本下载即可，点击之后就会跳转至下载界面（因为我的电脑上安装了一个迅雷下载，所以会自动跳转到迅雷下载的界面，如果是没有安装这类软件的话，应该会直接启动浏览器的下载），这里大家有可能会卡在一个加载界面，没有什么反应，因为这个是 github 上的，所以会出现这种情况，解决方法是等，不断尝试，或者，使用一下加速的软件，下载完成后应该会得到这样的一个 .exe 文件

013

这个就什么都不用多说了吧，直接双击打开应用程序，然后 next

014

点击 Browse… 选择 git 的安装位置，然后点击 next

015

后面的页面保持默认设置，一路 next ，到了下面这个页面时可以根据自己的需要进行选择，然后点击 Install 进行安装

016

等待安装结束即可

017

安装 Hexo 的博客框架

终于可以安装 Hexo 的博客框架了，现在在命令行中输入以下的代码 cnpm install -g hexo-cli，等待安装，安装好的结果如下

005

可以使用 Hexo -v 命令来验证 Hexo 是否安装完成

006

初始化博客文件夹

找个地方新建一个文件夹，作为博客的存储位置，像我的话，是在 c 盘下创建了一个 blog 的文件夹来作为我的博客文件夹

007

然后在命令行中 cd 进入到这个文件夹里面，或者一种比较简单的方式，点击一下文件夹上方的导航栏，输入 cmd ，回车直接进入当前命令行，也是在当前文件夹下了（下面的命令默认都是在这个博客目录下运行的，不在赘述了）

008

输入 hexo init 初始化博客框架（在 Windows 系统的情况下，因为羊哥那边使用的是 sudo hexo init，sudo 表示在 Linux 或者 Mac 中以管理员身份运行命令，但是我在 Windows 系统下运行这个命令的时候显示 ‘sudo’既不是内部或外部命令，也不是可运行的程序）

018

在本地 Hexo 运行博客

好了，完成了前面的一切，我们的博客其实就已经算是搭建完成了，接下来，我们就可以在本地先运行起来看下效果了，在命令行中输入这个命令 hexo s 回车

019

可以看到这里出现了一个网址，这表示我们的个人博客已经在我们本地服务器的 4000 端口上运行起来了，接下来，我们复制这一行地址，粘贴到浏览器上打开，就可以看到 Hexo 搭建的博客了，这里显示的是 Hexo 自带的一个默认主题，以及一篇默认的文章，教我们一些操作 Hexo 命令

020

创建一篇新文章

博客已经搭建起来了，接下来，要学习怎么创建文章，以及写文章了

要创建一篇新文章，非常方便，只需要在命令行中输入以下命令即可： Hexo n “文章的名字”

上面的 n 是 new 的缩写，你要是想的话，也可以将他补全，在 hexo 的命令中还有很多这种省略的命令，大家可以猜一下这些命令里面都是些什么单词

输入完上面的命令之后，回车，等一小会，就可以看到命令行中提示一个 Markdown 文件已经创建好了

021

按照那个文件的路径找过去，打开那个文件，开始编辑我们的第一篇文章（推荐使用 Typora 来编辑 Markdown 文档，关于 Typora 和 Markdown 的内容，这里先挖一个坑，之后我写一篇文章补上）

022

文章编辑好了之后记得保存，之后我们回到命令行，输入 hexo 经典三语句（本地部署版）

hexo clean
hexo g
hexo s

然后，像之前一样的，打开浏览器，输入网址，即可在本地浏览我们刚刚写好的文章了

023

在这里我们可以看到博客主页上显示的文章预览还是有一些待优化的地方，比如可以加入一些截断文章的操作之类的，这里再挖一个坑，我争取近段时间补上不是！哈哈哈，我最近好像有点喜欢上敲键盘写文章的感觉，虽然我的文笔真的烂

一些杂七杂八的感想

接下来我们要做的其实就是个人博客的远端部署了，嗯，怎么说呢，我刚开始和羊哥一样使用 Github 来部署这个个人博客，整体使用的感觉就是，网络连接真的差，很不稳定，然后我就尝试这将个人博客部署到国内的 Gitee 上面去，但是，因为某种我不知道的原因，也有可能是我太作了，老是喜欢去改些博客的设置呀，增加一点功能呀，导致在 Gitee 上面会出现很多的问题，这些问题我目前还没有办法解决，所以最后，我还是老老实实使用 Github 了（其实现在是 5 月了，快 618 了，要是到时云服务器的价格合适的话，我打算自己部署到云服务器上面去），至于网络问题，我现在找到了一个解决方法，使用 Stream++ 来加速，这个软件我现在使用的感受还是可以的， 我可以再挖一个坑，等用多一段时间之后，我写个使用的教程，还要一些使用的感受。

下面的就能猜出来了吧，使用 Github 来部署我们的 Hexo 个人博客，走起！！！

注册或者注册并登录 Github 账号

首先，打开 Github 的网址（直接在浏览器上方输入 github 就可以了），出现下面的页面

024

点击右上角的 sign in 登录 Github 账号，如果没有 Gibhub 账号，则点击 sign up 注册一个 Github 账号（自行注册，这个就不写进来了）

登录之后，去注册账号的邮箱里点击接收到的邮件，将邮件内的验证码输入到页面中间的输入框里，之后等待验证通过，就登录成功了（这个主要是因为我还没在这台设备上登录过，如果你在你的设备上登录过的话，应该是可以直接就登录进去的）

025

创建一个 Github 仓库

点击 Github 页面右上角的 + 号，在出现的菜单中选择 New repository

026

接下来，在出现的页面中，填写创建的仓库的相关信息，我们一步一步慢慢来

  1. 首先是仓库的名字，因为是部署个人博客的，所以 Github 仓库的名字有一定的命名要求，这个仓库的名字必须是你的用户名.github.io，比如我的用户名是 ShuYePL ，那么我的仓库名就必须是 ShuYePL.github.io
  2. 然后是仓库的介绍，这个看你自己心情了，随便写都可以
  3. 选择是否将仓库公开，这个，你既然是做个人博客，当然是要公开给别人看的啦，所以要选 public ，这个默认选项，不去动它也行

027

其他选项的话目前不需要动他了，拉到页面下方，点击 Create repository 的绿色按钮，仓库就创建完成了，刚创建出来的仓库是一个空仓库，什么都没有，因为我自己本来就有这个仓库了，我就不创建了

安装一个 Git 的部署插件

回到命令行，输入 cnpm install –save hexo-deployer-git 等待安装完成

028

设置博客的配置文件 _config.yml

打开个人博客文件夹下的 _config.yml 文件（用记事本打开就行），拉到文件的最下方，找到 # Deployment，在这个地方进行一些配置

029

  1. 首先是 type 选项，在它的后面填上 git

  2. 然后在 type 选项的下一行，写上一个属性 repo: ，后面空一行，填上你仓库的地址，仓库的地址回到你刚刚创建好的仓库页面，在下图红色方框内的内个就是你的仓库地址了，直接粘贴，复制到 repo 属性后面就好了

    030

  3. 再在配置文件的下一行中写上 branch: master

配置完的结果如下所示

031

最后，记得一定要保存

git 配置用户名和邮箱

如果没有这一步的话，下面的远端部署就会失败

032

配置过程如下，找到软件 Git Bash 打开（在 Windows10 端我喜欢直接右键选择 Git Bash）

033

在出现的界面中依次输入以下的两条指令

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

执行情况如下 请忽略掉中间那条输错的命令，surfacego 的键盘还用得不会很顺手

034

远端部署

马上就要完成了，hexo 三件套（远端部署版）掏出来

hexo clean
hexo g
hexo d

你也可以不用三件套，直接 hexo d 就行了，这里使用三件套主要是我已经习惯这样了，这样出错的概率会比较小

第一次运行 hexo d 命令的话会要求你登录 Github 账户，这里有两种登录方式，我选择了第二种

035

点击之后会出现一个验证码，我们先点击验证码下方的连接，会跳出一个浏览器窗口，在浏览器窗口中，我们点击绿色的按钮

036

在弹出来的窗口中输入内一串验证码，然后出现了一个输入密码的页面

037

输入你的 Github 账户密码，就完成了

038

上传的任务会继续执行，最终，上传成功了

039

查看远端是否部署成功

你的个人博客仓库名，等待浏览器加载，加载完了和你在本地端看到的一样就表示部署成功了

040

更换个人博客主题

怎么，原来的界面不是很好看，想换一个，命令行走起

先将主题下载下来

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

041

修改个人博客的配置文件 _config.yml ，在文件中找到 theme 这个地方，将他后面的值从 landscape 改成 yilia ，保存，这样就完成了

042

重新部署

043

好了，以上就是关于怎么搭建一个 Hexo 个人博客的完整笔记了（Windows 版），接下来大家就可以根据自己的需要，尝试去更改这个个人博客的设置，我已经算是用了一段时间这个 Hexo 博客了，现在感觉 Hexo 个人博客搭配 yilia 主题挺不错的，网上可以搜索到很多的教程，可以对博客的显示效果什么的进行个性化的设置，而且最重要的一点是，改动很多内容实际上只需要改动一下配置文件里面一些属性的值，就可以完成了，非常方便，嘻嘻嘻~

以下为使用Hexo搭建个人博客过程中遇到的一些问题，及其解决方案，还有一些改善页面显示效果的方式。

Q1：Markdown文件自动生成的文字中，tags：的作用是什么

在创建一篇文章（使用命令hexo n “文章名”）之后，打开该文章的Markdown文件，在文件的头部有如下的一段自动生成的文字：

Q1Markdown文件头部生成的文字

当我第一次在tags：填入内容时(胡乱填入，例如：51单片机，51，单片机)，使用相关的hexo命令时出现了错误提示：

Q1tag乱写之后出现的错误

在网上查到的结果是：在tags里面写的内容有一定的格式要求，格式如下：

Q1tags的正确编写格式

设置完tags后可以在主页“所有文章”（如下面上图标识）中打开tags（如下面下图所示），就可以根据tag快速筛选文章了。

Q1个人博客主页_标记所有文章

Q1所有文章_tag作用

Q2：在个人博客中添加不蒜子统计记录站点访问数

（这个东西真的花了一点时间，查了很多其他人的博客，照做了，但都没有达到相应的效果，最后自己照着不蒜子官网的方式来一下子就好了）

不蒜子网站：http://busuanzi.ibruce.info/ ，网站页面如下

Q2不蒜子页面

注意中间黄色方框内的两行代码，将这两行代码分别粘贴到blog\themes\yilia\layout_partial\footer.ejs文档的如下位置（就是你想显示统计数据的地方）：

Q2不蒜子代码在文档中的位置

记得将文档的编码方式改为utf-8（不改的话会显示乱码），显示效果如下：

Q2显示效果

这里的数字很大是因为用hexo s在本地查看的原因，将文件上传到远端就好了。

Q3：vscode中Markdown预览插件看到的结果和在yilia主题中看到的不一样

如对于以下的一段Markdown代码：

- 获取一维数组元素的值：  
  >代码示例：`数组名[元素下标]`   
  例子（这里顺便将得到的值进行打印输出）：   
  >```java  
  int[] nums = {1, 2, 3, 4, 5};  
  for(int i = 0; i < 5; i++){  
      System.out.print(nums[i] + " ");  
  }  
  ```  
  输出结果：1 2 3 4 5

在vscode中的显示结果：

Q3vscode中的显示结果

在yilia主题下的显示结果：

Q3实际yilia主题下的显示结果

Q4：围栏代码显示失效

有时在yilia主题下显示代码块时，没有办法按照指定的方式进行语法突出显示，解决方法是不要将代码块包含在反引号中，而是包含在波浪号中。（目前不知道具体的原因，只知道这样做可行）

Q5：记录自己的总文章数

参考资料：Hexo-yilia主题个性化美化及功能添加 - 知乎 (zhihu.com)

在F:\blog\themes\yilia\layout_partial\left-col.ejs文件中

<nav class="header-menu">
    <ul>
    <% for (var i in theme.menu){ %>
        <li><a href="<%- url_for(theme.menu[i]) %>"><%= i %></a></li>
    <%}%>
    </ul>
</nav>

的后面加上下面这段代码：

<nav>
    总文章数 <%=site.posts.length%>
</nav>

Q6：在头像的下面显示自己的昵称

在F:\blog\themes\yilia\layout_partial\left-col.ejs文件中

<% if (theme.subtitle){ %>
<p class="header-subtitle"><%=theme.subtitle%></p>
<%}%>

后面加上以下代码：

<font size="6">薯叶</font>

font标签中size属性的值可以是1~7中的任一个整数，数字越大，显示出来的字体也就越大。

Q7：解决yilia主题页脚翻页按钮显示bug

Q7显示bug

这个问题真的是困扰了我很久了，甚至我都想放弃解决这个问题了，直到在美化其他部分的时候看到一篇文章：(19条消息) 软件 | hexo博客主题yilia上一页下一页显示的问题_RyanCYK的计算机世界-CSDN博客，找到具体的解决方法，在F:\blog\themes\yilia\layout_partial\archive.ejs文件中第8、9行代码修改如下

prev_text: '上一页',
next_text: '下一页'

第37、38行的代码修改如下

prev_text: '上一页',
next_text: '下一页'

之后在打开与archive.ejs同级目录下的script.ejs文件，按Ctrl+f找到a标签中的&laquo; Prev和Next &raquo;，并将其删除即可。

Q7显示正常

Q8：yilia 主题配置文章分类功能

Hexo 博客 yilia 主题下配置文章分类功能的文章在网上一搜一大把，但是，都是一模一样的文章，(⊙o⊙)… 照着那样做就能做出分类功能，但内个样式我不是很喜欢，所以在配置好之后自己进行了一点点修改。

PS：没学过 ejs ，所以就用普通的 html 和一点点的 css 简单改一下而已。

首先，在博客目录下使用以下命令行指令

hexo new page categories

上面的 categories 是可以更改的，看个人喜好。然后，在博客目录下会生成 source -> categories -> index.md 这个文件，打开它，将里面的内容修改如下

---
title: 文章分类
date: 2022-06-23 10:07:14
type: categories
layout: "categories"

---

打开 yilia 主题的 _config.yml 文件，在文件的头部可以看到下面的 menu 选项，在下面添加分类选项（这里填写的东西最后会显示在头像的下面）

menu:
  主页: /
  #随笔: /tags/随笔/
  分类: /categories

然后打开博客目录下的 themes -> yilia -> source -> main.0cf68a.css ，在末尾的地方添加以下代码

/* 这个是文章分类页面的css样式，目前只看到这一个地方是有用的 */
.category-all-page {
  margin: 30px 40px 30px 40px;
  position: relative;
  min-height: 100vh;  /* 这个控制分类页面的最小高度 */
}
.category-all-page h2 {
  margin: 20px 0;
}
.category-all-page .category-all-title {
  text-align: center;
}
.category-all-page .category-all {
  margin-top: 20px;
}
.category-all-page .category-list {
  margin: 0;
  padding: 0;
  list-style: none;
}
.category-all-page .category-list-item-list-item {
  margin: 10px 15px;
}
.category-all-page .category-list-item-list-count {
  /* 这个地方调整的是分类链接后面跟着的括号和里面的数字的样式 */
  color: $grey; 
}
.category-all-page .category-list-item-list-count:before {
  /* 分类连接后面的文章数前面的符号 */
  display: inline;
  content: " (";
}
.category-all-page .category-list-item-list-count:after {
  /* 分类连接后面的文章数后面的符号 */
  display: inline;
  content: ") ";
}
.category-all-page .category-list-item {
  margin: 100px 10px;
}
.category-all-page .category-list-count {
  color: $grey;
}
.category-all-page .category-list-count:before {
  display: inline;
  content: " (";
}
.category-all-page .category-list-count:after {
  display: inline;
  content: ") ";
}
.category-all-page .category-list-child {
  padding-left: 10px;
}

在 yilia -> layout 目录下创建一个文件，名字为 categories.ejs ，内容如下

<article class="article article-type-post show">
  <!-- 这个是头顶的那个很丑的部分，待会改一下 -->
  <header style="border-bottom: 1px solid #ccc;border-left:none;">
    <div itemprop="name" sytle="">
      <!-- <%= page.title %> -->
      <p style="color:black;font-size:40px;text-align:center;">文章分类</p>
      <h2 style="margin:1%;text-align:center">共计&nbsp;<%= site.categories.length %>&nbsp;个分类</h2>
    </div>
  </header>

  <div class="category-all-page">
    <% if (site.categories.length){ %>
        <%- list_categories(site.categories, {
          show_count: true,
          class: 'category-list-item',
          style: 'list',
          depth:3,  
          separator: ''
        }) %> 
    <% } %>
  </div>
</article>

到这里，这个分类功能就已经算是配置完成了，要想对文章进行分类，只需要在文章的头部添加以下内容即可

categories：
    - 这里填写文章属于哪一个分类

例如：

title: Github 配置 SSH
date: 2022-05-30 21:22:00
tags:
    - 个人博客
categories:
    - 个人博客

Q9：yilia主题下添加评论系统

使用 Gitment 搭建个人博客评论系统

001

有人知道我看见这个的时候有多兴奋吗，如果有人和我一样经历差不多一天的时间在网上看几年前的资料，然后开始尝试，到处碰壁的话，也许就能感受到这种兴奋了。

之前我使用过畅言来作为评论系统，那个时候，真是(⊙_⊙)?，看见下面有出现评论的东西了，就以为搞定了，然后上传博客，等着别人的评论，直到一天在上课实在无聊，打开博客想在评论区说点无聊的话，才发现根本不能发言，嗯。。。。然后我花了大概两三天的时间都在弄畅言上，结果，那肯定是没搞定的，不然我现在也不会来搞这个了是吧，昨天给博客弄了只猫以后，就想着给弄个评论系统，没想到这么难弄（捂脸）。

这里我用的评论系统是 Gitment 搭建起来的，主要优点就是免费。首先，你需要一个 Github 仓库，这个我是直接新建了一个仓库的，没有用我个人博客原来的那个仓库，这个很简单了，不放截图什么的了，然后，在 github 右上角的头像哪里，点击旁边的小三角，点击 Settings ，将页面拉到下面，在左边找到 Developer settings ，点击 OAuth Apps –> New OAuth App

002

在注册页面中填写相关信息

  1. Application 的名字（随便写）
  2. 博客主页的地址
  3. 这个 Application 的描述（随便写）
  4. 这个一般和博客地址一样就行了
  5. 最后点击绿色的按钮，over

003

跳转到这个页面之后，点击右边红色方框内的按钮

004

出现这个界面后，不要跳转到其他页面，点击我下面遮掉位置右边蓝色的东西，复制这段东西 ，这段东西只会出现一次，要保存好，不然之后要重新生成

005

打开 yilia 主题下的 _config.yml 文件，找到 Gitment 配置的地方，这里的四个参数分别是

  1. 你的 github 账户名字
  2. 存储评论的仓库名字
  3. 下面两个client_id 和 client_secret，在刚刚注册的页面那里可以看到，复制过来

记得保存

在 blog\themes\yilia\source\lib 这个目录下放置两个文件 gitment.css 和 gitment.js ，（这两个文件来自 yilia-plus 主题，你们到我的个人博客仓库下应该是可以下载的，那边的话就直接是在 lib 文件夹里面了，把他们放到上面说的路径里面就可以了）

这里的话，如果大家有需要，我单独开一个仓库，放一下？？？

提示：lib 文件夹要自己创建

006

打开 blog\themes\yilia\layout_partial\post\gitment.ejs 这个文件，有两个需要配置的地方，见下图标注

007

配置完成之后将博客部署到远端，然后打开你的博客，在文章下面应该就能看到评论的区域了

008

这个时候这边博客的评论还没初始化，点击右边的 login 登录你的 github 账户，然后点击 初始化评论 按钮初始化评论，接下来就可以直接发表评论了

009

这个方式建立的评论系统在每一篇博客发表之后都要进行一次初始化。

注意：在你第一次登录这个评论系统的时候可能会报错，别慌，按键盘上的 F12 ，打开开发者工具，这个时候可以看到右边出现了一堆红红的东西，点击第一个红红的东西后面的地址，跳转到一个页面之后应该能看到一个字，以及，在第二行字（也就是最后一行字）后面有个按钮，点击它，然后就好了。

Q10：添加小猫咪（看板娘）

将命令行切换到博客文件的位置，输入以下命令，安装依赖

npm install --save hexo-helper-live2d

下载模型点击这里，链接点击过去会看到很多文件夹，每一个文件夹都是一个模型，加入模型的时候，将模型文件直接整个丢进 node_modules 文件夹中即可（更新：npm安装或者将模型文件放在hexo根目录下），然后将以下内容加入到博客的 _config.yml 文件中或者主题的 _config.yml 文件中

## Live2D看板娘
live2d:
  # 是否要开启看板娘，false 就是关闭
  enable: true
  pluginModelPath: assets/
  model:
    # 这里填入你想要显示的模板的名称，也就是你加入到 node_modules 文件中内个模型的名字
    use: live2d-widget-model-hijiki
  display:
      # 这里可以调整模型显示的位置，可以写 left 或者 right，将模型显示在左下角或者右下角
    position: left
    # width 和 height 属性可以调整整个模型显示的大小，这里我的小猫在 1:2 的比例下都能显示出来
    width: 150
    height: 300
  mobile:
    # 是否要在手机端显示，true 就是要，false 就是不要
    show: false   
  rect:
    opacity:0.7

修改上面的配置后，想在页面上查看效果，需要重新启动服务，即

hexo clean
hexo s

Q11：博客上传错误解决方法

国内上传到github上面经常会发生错误，解决方法，经典三件套

hexo clean
hexo g
hexo d

Q12：个人域名绑定在远端推送后失效

个人域名绑定

  1. 进入个人博客的仓库，点击 Settings
  2. 点击 Pages
  3. 在 Custom domain 下方的方框中填入你的域名，点击旁边的 Save 按钮
  4. over

001

绑定成功显示结果

002

域名绑定之后就可以用域名访问个人博客了，但是，在远端推送之后可能会出现以下问题

003

域名失效解决方法

这个时候，别着急，先按绑定域名的步骤再来一次，然后，在个人博客文件中 source 目录下创建一个文件，命名为 CNAME ，注意，该文件没有后缀

004

用记事本打开，在里面写上你的域名，保存，然后再推送即可

005

Q13远端推送时SSL证书验证不通过

因为国内 Github 的访问经常会断开，所以我使用了 steam++ 来为 Github 访问加速，然而，我发现在加速器开起来之后，我就没有办法进行远端推送了，导致现在使用加速器看起来好像很鸡肋，只要我想将自己写好的博客文章推送到 Github 上面就会出错：

fatal: unable to access ‘https://github.com/ShuYePL/ShuYePL.github.io/': SSL certificate problem: unable to get local issuer certificate，报错情况如下

001

我猜测可能是因为加速器的原因导致 SSL 证书验证没有通过

解决方法是解除 SSL 验证，在命令行中输入下面的代码

git config --global http.sslverify "false"

重新推送即可

Q14：Support for password authentication was removed on August 13, 2021.

remote: Support for password authentication was removed on August 13, 2021.
remote: Please see https://docs.github.com/en/get-started/getting-started-with-git/about-remote-repositories#cloning-with-https-urls for information on currently recommended modes of authentication.
fatal: Authentication failed for ‘https://github.com/ShuYePL/ShuYePL.github.io/'

这个问题的出现原因是我最近因为拉取代码的缘故修改了一些git配置，然后可能将里面的token设置给修改到了，使用http的方式提交代码失效了，因为我已经设置好了ssh，所以，直接在_config.yml中，将远端仓库的地址改成ssh格式的就可以了

参考资料：

Java数组