Hexo 全套介绍
什么是Hexo ?
- Hexo 是一个快速、简洁且高效的博客框架。Hexo 使用 Markdown（或其他渲染引擎）解析文章，在几秒内，即可利用靓丽的主题生成静态网页。
搭建前的环境准备
- 到官网下载对应的安装包安装即可 - nodejs 简单的说 Node.js 就是运行在服务端的 JavaScript。 - git 是一个开源的分布式版本控制系统，可以有效、高速地处理从很小到非常大的项目版本管理，hexo主要使用github作为代码托管平台 - vscode用于编辑代码。
安装Hexo
- 有了上述的环境，就可以直接安装hexo的框架环境，只需要使用包管理命令安装即可，同时因为我们安装了git工具，这时候右键就可以打开git bash，会出现git的终端，然后执行下面的命令安装即可。
- 其中，-g 代表全局进行安装
.npm install -g hexo-cli
• NPM是是一个NodeJS包管理和分发工具，已经成为了非官方的发布Node模块（包）的标准
初始化博客目录
有了上述的hexo框架，执行下列命令，Hexo 将会在指定文件夹中进行初始化，生成一个基础博客目录
hexo init 文件名
需要注意的是，git bash作为一个终端，是要注意路径的，例如你在桌面打开了git bash，对应的目录就会是桌面，又或者你在F盘打开了git bash，目录就会显示F: 意味着你要生成基础博客目录存放的位置 。
解决卡顿的工具
因为npm包管理连接较慢，所以往往这个命令会卡住不动，可以使用dev-sidecar工具
如何设置
因为我的系统是Windows，所有我只演示Windows的设置
\1. 第一次打开，我们要看右上角，安装根证书
\2. 软件内也给出了详细的教程
因为我们需要解决npm的问题，所以需要勾上npm（如果还是卡顿，可以使用安全模式）
init命令详解（此处可忽略）
- 其实hexo init 这个命令，进行了两步操作 - 第一步：下载初始文件 - 第二步：安装基础的模块
- git clone https://github.com/hexojs/hexo-starter.git 目录
npm install
文件目录解释
• .github存放博客初始化文件的git信息，可删
• node_modules模块目录
• scaffolds存放博客生成文章、页面模板的文档
• source存放博客相关页面的目录
• themes存放主题目录（传统的博客安装方式会用到，最新的主题都用不到这个目录，因为已经改成了npm模块的安装方式）
• .gitignore git的忽略文件
• _ config.yml 存放主题的站点基本信息
• package.yml存放模块信息
async主题的安装方式
这个主题就是使用的模块安装方式hexo-theme-async代表主题的模块名字，hexo-renderer-less hexo-renderer-ejs hexo-wordcount是主题渲染需要用到的模块
只需要在博客目录打开git bash，执行下面的命令即可
npm install –save hexo-theme-async hexo-renderer-less hexo-renderer-ejs hexo-wordcount
路径要注意指向博客目录
由于_config.yml是站点配置文件，记录的这个博客的基本情况，我们安装了新的主题，需要去config.yml文件修改对应的主题的字段为async
之后运行hexo s可以预览博客
主题安装
- 其他主题如何安装 只需要在hexo的主题页面https://hexo.io/themes/
- ，找到相应的主题，打开GitHub地址（点击主题的名字），在每个主题的README都会告诉你如何安装这个主题
站点配置文件的修改
• title：站点标题
• description：站点描述
• author：站点作者
language：站点语言（根据主题而定的字段） 该主题的中文为zh-Hans
如何配置主题
由于不同的主题配置方式不同，这都是根据主题作者而定，所以需要找到async主题的使用文档 > https://hexo-theme-async.imalun.com/
文档当中已经给出了最详细的配置教程，由于主题具有特殊性，所以不同的主题文档都是独一无二的，无法相互借鉴
在async主题中，指出 > 在 _config.async.yml 中定义您所需要的配置,所以我们需要在博客目录创建这个文件，作为主题的配置文件，而且目前来说还是空的
值得注意的是，目录里面还有_config.landscape.yml这个其实是landscape主题的配置文件，也就是hexo默认主题的配置文件，可以把他删掉，不影响博客运行
配置示例
1.这个主题的配置其实非常简单，所以只展示一个例子，其余的都是如此 - 例如，主题给出了用户信息的配置选项，如果你想修改，只需要复制下面给出的代码 - 上面是参数详解，下面是代码
- 直接复制到主题配置文件，就生效了，具体的参数只需要根据主题文档给出的参数详解修改即可
• 又或者你要修改导航栏，也是把下面的代码复制到主题配置文件即可
要注意的是，修改完对应的参数，需要执行hexo s，查看是否报错，是否本地可以预览。
如何上传博客进行托管
• 然后打开你的站点配置文件_config.yml
• 下面有个deploy字段，这个是用来记录你的GitHub仓库信息
• 修改type为git，新增branch为main，repo就是刚刚复制的地址
安装上传插件
- hexo默认没有上传GitHub的功能，需要一个插件实现，也是使用npm进行安装，在博客目录下执行
- npm install hexo-deployer-git –save
密钥准备
github当然不允许你随便上传，所以需要一个密钥，让github知道你是这个git账户的主人，所以需要执行一个生成密钥的命令
ssh-keygen -t rsa -C “你的邮箱“
不管出现什么信息，你只需要回车就可以了，大概三个回车就创建完成了
执行
cat ~/.ssh/id_rsa.pub
就可以输出你的密钥，全部复制下来
填写密钥
依次点击头像-setting-ssh and GPG kyes
• 然后点击new ssh key
• 粘贴你的密钥在下面，title可以随便写
• 然后点击add ssh key即可
执行
ssh -T git@github.com
会提示你下面这个，输入yes回车就行了
Are you sure you want to continue connecting (yes/no/[fingerprint])?
正式上传
下面这个命令代表上传博客到GitHub
会使用hexo的框架能力，生成静态文件，然后上传到github
hexo g -d
vercel 部署
GitHub只是作为托管平台，使用vercel可以让你的网站在线访问
需要准备一个域名，然后打开vercel，使用github账号注册即可
然后依次点击add new - project
选自己的github账户（如果没有就新增） 然后找到自己存放博客的仓库，点击import
点击deploy，然后等待页面刷新
域名解析
点击view domains
输入你的域名，然后点击add即可
然后去到你的域名控制台，根据vercel的提示添加两个解析
具体的记录值，需要看vercel提供的值 - 第一个是@ A记录 - 第二个是 WWW CNAME记录
解析完成后，搭建基本完成 ## 命令说明
hexo new #”文章名”
hexo new page #”页面名”
hexo s #预览命令
hexo g -d #上传命令
值得注意的是hexo new page，这是生成页面的命令，默认情况下，hexo不会提供tags、about、categories、links这几个页面，所以需要单独执行生成
而且这是根据主题的需要，async主题，没有单独的tags和categories页面，直接生成即可
about和links页面也需要生成，但都不需要配置，因为这个主题把配置挪到了配置文件里面
图床的搭建
图床的搭建
图床是用来存放图片的地方，可以上传图片返回在线地址，可以极大提高博客访问速度，同时对于markdown来说，也需要这样的工具，来插入图片
picgo安装
一个用于快速上传图片并获取图片 URL 链接的工具
> https://github.com/Molunerfinn/PicGo
安装vika插件
其实用来存放图片的地方很多，GitHub也可以存放图片，但访问速度有点慢，使用vika也是不错的方案
注意先创建一个空白的表作为图床
搜索vika即可安装
然后进行配置
APIToken在开发者配置
ID在API里面打开，点击get，datasheets后面的一小段就是ID
回到上传区，上面选择vika即可
下面的链接格式代表你想要返回的格式
如果选URL，代表只返回一个单独的链接
如果选markdown，会自动返回一个markdown格式的链接，可以直接粘贴进文章