简介
Hexo
Hexo 是一个基于nodejs 的静态博客网站生成器，是我们用来构建一个博客网站的基础。
当然市场上类似的产品很多，比如 Jekyll 和Hugo等等，原理基本都是差不多的，如果你有自己喜欢的构建工具，也可以替代Hexo
什么是 Hexo？
Hexo 是一个快速、简洁且高效的博客框架。Hexo 使用 Markdown（或其他渲染引擎）解析文章，在几秒内，即可利用靓丽的主题生成静态网页。
GitHub Pages
什么是GitHub Pages？
GitHub Pages 是直接从 GitHub 存储库托管的静态网站。 但它们不仅仅是静态文件的集合。 通过利用 Jekyll 和 Liquid 等网站生成技术，开发人员可定义被处理为完整静态网站的动态模板。 每次将更改提交到与网站关联的源分支时，都会使用最新更新重新生成该更改，并自动将其发布到目标 URL。
GitHub Pages官网链接
简单的说，就是把你的博客网站放在GitHub Pages上进行免费托管，让大家都能访问
GitHub Pages也可以换成任意一个支持Hexo的托管服务
比如Gitee Pages、coding、Vercel等等
当然，我原本是想使用Gitee Pages的，毕竟国内的访问速度会快很多，但是…
居然是因为政策法规影响，不得已放弃
你现在所浏览的博客就是利用hexo+github搭建而成的，并且完全免费，不会产生任何费用（当然，如果你想使用自己的域名，可能会产生相关费用）
如果你的基础较好，或者对此类开发部署方法有所了解，也可以试试使用Vercel托管
安装hexo
安装前提
安装 Hexo 相当简单，只需要先安装下列应用程序即可：
Node.js (Node.js 版本需不低于 10.13，建议使用 Node.js 12.0 及以上版本)
Git
这里默认你已经安装好了Node.js和Git，安装过程不再赘述
安装 Hexo
所有必备的应用程序安装完成后，即可使用 npm 安装 Hexo
npm install -g hexo-cli注意：-g是指全局安装hexo
创建一个文件夹，用来存放你的项目代码，进入文件夹内，开始进行hexo 初始化
hexo init这时刷新文件夹就可以看到整个项目的文件目录结构了，然后安装依赖
npm install继续下一步，进行构建，构建完成会生成一个public文件夹
public文件夹内就是我们生成的静态网站内容，我们在部署到github时，就是上传这部分代码
这里已经安装并构建完成了，我们可以启动看看效果
hexo server
注：这里看到我执行的是hexo s 实际上是hexo server命令的简写，效果是一样的
hexo命令：
- hexo clean ##清理
- hexo g ##构建、编译
- hexo s ##启动服务
- hexo d ##上传至服务器
这就是博客的默认主题页面了，下一步开始进行更换主题
更换主题
我们可以看到官方默认提供的主题功能并不多，页面也比较简单，当然我们可以自己进行修改，但是官方也提供一些网友自己制作的主题，功能更加丰富，可以直接套用
你可以从官方提供的主题库中选取增加喜欢的主题
附上我使用的主题链接：
Hexo博客主题之hexo-theme-matery
每个主题内会有安装调试的使用介绍，因为每个主题的设置项不同，这里不再展开复述，请按照主题内教程进行配置
Hexo扩展插件
介绍
Hexo 有强大的插件系统，使您能轻松扩展功能而不用修改核心模块的源码。
在 Hexo 中有两种形式的插件，脚本（Scripts）和插件（Packages），这里不讨论脚本（Scripts）形式，只介绍和推荐插件（Packages）形式
扩展插件可以很方便的使我们的博客功能更加丰富
我们可以看到，官方给出的插件库中足足有385个插件可以使用
这些插件都能做什么呢？举个栗子
在我所使用的主题中，就应用到了以下几个插件：
- hexo-permalink-pinyin :
中文链接转拼音
如果你的文章名称是中文的，那么 Hexo 默认生成的永久链接也会有中文，这样不利于SEO，且gitment评论对中文链接也不支持。我们可以用 hexo-permalink-pinyin Hexo 插件使在生成文章时生成中文拼音的永久链接。 - hexo-generator-search
内容搜索插件 - hexo-wordcount
文章字数统计插件
如果你想要在文章中显示文章字数、阅读时长信息，可以安装 hexo-wordcount插件。 - hexo-filter-github-emojis
添加emoji表情支持
本主题新增了对emoji表情的支持，使用到了 hexo-filter-github-emojis 的 Hexo 插件来支持emoji表情的生成，把对应的markdown emoji语法（::,例如：:smile:）转变成会跳跃的emoji表情。 - hexo-generator-feed
RSS 订阅支持
好，插件就介绍到这里，接下来我们安装几个我们需要使用的插件（当然，你也可以不使用，非必须）
安装hexo-deployer-git插件
Hexo 的Git 一键部署插件。
我们在插件市场搜索deployer，可以看到官方已经提供了大部分平台的一键部署插件，我们前面选用的是github，所以我们对应的需要使用hexo-deployer-git插件
安装
npm install hexo-deployer-git --save配置项说明
找到根目录下的文件 _config.yml 配置你的git信息
# You can use this:
deploy:
type: git
repo: <repository url>
branch: [branch]
token: ''
message: [message]
name: [git user]
email: [git email]
extend_dirs: [extend directory]
ignore_hidden: false # default is true
ignore_pattern: regexp # whatever file that matches the regexp will be ignored when deploying
# or this:
deploy:
type: git
message: [message]
repo: <repository url>[,branch]
extend_dirs:
- [extend directory]
- [another extend directory]
ignore_hidden:
public: false
[extend directory]: true
[another extend directory]: false
ignore_pattern:
[folder]: regexp # or you could specify the ignore_pattern under a certain directory
# Multiple repositories
deploy:
repo:
# Either syntax is supported
[repo_name]: <repository url>[,branch]
[repo_name]:
url: <repository url>
branch: [branch]配置项看起来很复杂？我们只需要配置其中简单的几项就可以:
deploy:
type: 'git'
repository: 'https://github.com/witleo/witleo.github.io.git'
branch: master注：无论是部署到GitHub Pages，还是Gitee Pages或者GitLab Pages，部署方式都是相同的，你只需要修改你的Git地址就可以了
安装hexo-admin插件
hexo-admin 是一个Hexo博客引擎的管理用户界面插件。这个插件最初是作为本地编辑器设计的，在本地运行hexo使用hexo-admin编写文章，然后通过hexo g或hexo d（hexo g是本地渲染，hexo d是将渲染的静态页面发布到GitHub）将生成的静态页面发布到GitHub等静态服务器。如果你使用的是非静态托管服务器，比如自己买的主机搭建的hexo，那么一定要设置hexo-admin 的密码，否则谁都可以编辑你的文章。
安装
npm install hexo-admin --save安装完成后启动hexo
hexo server打开 http://localhost:4000/admin/ 就可以访问到hexo-admin管理页面了
hexo-admin的功能很多，你可以通过后台界面发布文章，修改一些设置项，还可以执行脚本等等，这里不做过多介绍，总之它可以帮助我们更好的管理博客网站
部署到GitHub Pages
网站已经搭建好了，现在最重要的就是让所有人可以访问你的博客，我们利用GitHub提供的免费Pages服务来实现这一点
创建github仓库
我这里假设你已经注册好了GitHub的账号，并且你可以正常访问GitHub的网址
首先，创建一个项目
这里起名时要注意一点，GitHub Pages提供路径两种方式
- username.github.io
- username.github.io/projectname
第一种是个人主页，第二种是项目主页
每个人只能有一个个人主页，可以有多个项目主页
如果你希望使用搭建个人主页（推荐），起名时需要使用： 你的用户名.github.io 这种格式，如下图所示
开启Pages服务
创建完成后复制你的GitHub地址
打开hexo项目根目录下的文件 _config.yml 配置你的git信息
deploy:
type: 'git'
repository: 'https://github.com/witleo/witleo.github.io.git'
branch: master配置好了之后，回到你的hexo项目目录，执行命令
hexo deploy hexo deploy 命令会将public目录的文件强制推送到github上，现在到你的github上就能看到编译完成的网站代码了
然后到GitHub上开启你的Pages服务
点击 设置 - Pages ，路径选择root，然后保存
我们稍作等待，直接访问我们在Pages显示的地址就可以访问博客了
自定义域名
我这里的设置使用了自己的域名，如果你有自己的域名，也可以在Custom domain中添加
编写博文
使用Markdown格式编写博文
首先，我们编写博客的文章需要使用markdown 格式，什么是markdown ？
Markdown是一种轻量级标记语言，创始人为约翰·格鲁伯（英语：John Gruber）。 它允许人们使用易读易写的纯文本格式编写文档，然后转换成有效的XHTML（或者HTML）文档。这种语言吸收了很多在电子邮件中已有的纯文本标记的特性
现在，几乎所有的博客网站都已经支持Markdown语法，包括CSND、博客园等等
Markdown，这个至今没有中文译名的书写工具，作为比特世界的「笔」，自被发明之初就随着博客发展的浪潮传向互联网的每一片大陆，成为新闻民主化进程中的重要工具。不过它的拥趸在为它唱赞歌的同时，更多的人或胆怯于它陌生的使用方式，或不屑于它复杂的标记字符，始终没有领略这一工具的优雅。
Markdown快速入门
OK，我们还需要一款markdown编辑器帮助你来完成排版。
当然，就算你使用记事本也可以
我目前使用的markdown客户端是Typora
Typora 是一款支持实时预览的 Markdown 文本编辑器。它有 OS X、Windows、Linux 三个平台的版本，是完全免费的。
关于Typora的主要特点都在这里，我就不再赘述了
如果你不想安装新软件，也可以试试印象笔记推出的在线编辑器马克飞象
他会将你的笔记存在本地，也可以一键同步到印象笔记
使用图床
图床，顾名思义 指储存图片的服务器，就是专门用来存放图片，同时允许你把图片对外连接的网上空间，它可以将照片转换成更容易分享的代码、链接等等，提高用户图片的使用效率。
下面的文章介绍的很详细，这里不再赘述
本文使用Typora+PicGo-Core+Gitee实现
参考文章：
自动部署
我们以上工作都部署完成了，就可以愉快的写文章了
正常来讲，教程到这里就应该结束了
但是，按照上面的教程，我们发布一遍文章的顺序是这样的：
- 使用Typora来编写文章
- 删除\hexo\source\_posts文件夹下的内容
- 将编写之后的md文件复制到\hexo\source\_posts文件夹下
- 打开cmd窗口，定位到hexo下
- 执行hexo deploy 命令上传文章
对于这么机械化的操作流程，作为一个脚本重度用户，肯定是需要使用脚本来自动完成的
首先创建一个.bat文件
然后按照上面列出的步骤，实现脚本：
@echo off
echo ---------------------1.进入到你的hexo文件夹目录下---------------------
d:
cd D:\work\hexo\
echo ---------------------2.清空项目的_posts文件夹---------------------
del /f /s /q D:\work\hexo\source\_posts\*.*
echo ---------------------3.将你的md文档复制到_posts文件夹内---------------------
copy D:\work\md文档\外部文档\*.md D:\work\hexo\source\_posts
echo ---------------------4.清理项目---------------------
call hexo clean
echo ---------------------5.上传到github---------------------
call hexo deploy
echo ---------------------完成---------------------
好了，这样我们点击执行脚本，就可以一键部署到github了
正常来讲，教程到这里又该结束了
但是，这样还是要离开Typora编辑器。用过IDEA之类编辑器的都知道，在IDEA内部就能执行脚本，并且还能保存脚本配置，在你下次使用时，只需要点一个按钮就可以完成复杂的工作
那么能不能把脚本集成到Typora内呢，我翻遍了Typora的设置项，终于让我找到了一处可以执行脚本的地方
官方文档介绍说，可以在导出时触发命令，例如:要将当前文件提交到 git 服务器，你可以在这里使用git add命令
原文连接：https://support.typora.io/Export/#other-formats-using-custom-commands
OK，我们可以在此处加入我们的脚本
点击 文件 - 偏好设置 - 导出 ，我们添加一个导出项
模板选择自定义
在命令行处添加我们上面写好的脚本路径
call D:\Typora\uploadToGihub.bat
接下来我们验证一下，创建一个测试md文件，然后点击文件 - 导出 - 上传到github
在Typora顶部会提示正在导出，此时正在执行脚本
待脚本执行完成后，Typora顶部会进行提示，当失败时会弹出窗口显示log日志
可以看到这里提示我上传成功了,日志中都是强制推送覆盖的警告，我们不用管
稍待片刻，访问博客网站进行验证
OK，已经可以看到我们刚才创建的文件已经上传成功了
现在，我们仅在Typora内就可以完成编写文章和上传部署的所有操作了
一键部署演示：
