Hexo之高效编写文章

背景

为了Hexo更好地撰写博客，一直想找个符合个人想法的markdown编辑器，试用过SublimeText3、Gitbook、小书匠，看过主流笔记类编辑器，总不能满足自己的需求。

经过长期探索，发现一款很不错的HexoEditor，专为Hexo博客实现的编辑器，颜值高、纯白的画面太美；但是在Windows、Mac上均尝试后，还是发现一些瑕疵，比如

新建Post经常无反应，不能成功创建md文档
创建Post md成功了，文件名称是固定的时间串202004051730.md，手动修改title后，自动修改的文件名不会带时间格式，不可以生成_config.xml配置的自定义格式
设置了Hexo配置文件_config.xml，却不起作用
设置Tag模板目录不能添加，还不懂什么意思
右键Hexo同步文件名，会去除文件名的时间格式，仅保留title为文件名等等

调研

在baidu google搜索了很久，看了很多文章，仍然没有一个我需要的解决方案；但终究有几篇文章，各自提供了一点思路。在这些思路的帮助下，我最终硬着头皮尝试并总结出一套适合自己的方案，并且这个方案，帮我达到了更高效的撰写博客。
在此，先列出对我高效方案有益的几篇文章，以示感谢：

简要说下，上面3篇文章，其实写的不怎么样，但提供的思路有两个：

hexo new生成的md文件，按年月在_posts里进行目录分类，不同于categories分类哦！
hexo new生成md文件后，自动打开HexoEditor编辑器，省去后期在大量文章里寻找刚创建的md文件。

实践方案

HexoEditor设置Hexo配置、渲染主题、图片(虽然很容易配置七牛，但不太敢上传，暂时用hexo qiniu s进行上传图片)
修改站点配置_config.xml，实现md文件按年月进行目录分类，方便后期对文章的管理查阅
1
2
permalink: :year/:month/:day/:title/ # blog article link
new_post_name: :year-:month/:year-:month-:day-:title.md # File name of new posts
每个时间field前面必须跟着:冒号，这是语法，否则取不到对应的时间。
安装shelljs插件，实现自动部署加载JS脚本
1
npm install --save shelljs

创建scripts目录，编写auto_open.js脚本，hexo new后自动调用命令，打开HexoEditor

在hexo根目录下
mkdir scripts&&cd scripts
touch auto_open.js
vim auto_open.js
输入代码
var exec = require('child_process').exec;

hexo.on('new', function(data) {
    exec('open -a "/Applications/HexoEditor.app"  ' + [data.path]);
});
保存退出:wq

hexo new新文档测试，自动打开HexoEditor。编写md文档文本内容，利用HexoEditor预览、与发布后的博客同样的主题效果

hexo new autoopen
...
INFO  -----------------------------------------------------------
INFO  qiniu state: online
INFO  qiniu sync:  true
INFO  qiniu local dir:  cdn
INFO  qiniu url:   http://cdn.shendawei.cn/cdn
INFO  -----------------------------------------------------------
INFO  Created: ~/Development/hexo/shendawei/source/_posts/2020-04/2020-04-07-autoopen.md

这样生成的2020-04-07-autoopen.md，就存在于_posts/2020-04/目录下，实现了目录分类效果
自动打开HexoEditor，并且打开的是2020-04-07-autoopen.md文档
尽情编写md文档，右侧预览的效果，即是发布后的效果！！

截图粘贴图片，生成可用的md语法图片引用，主要是获取图片路径，不手动填写图片路径

微信Control + Command + A快捷键截图
Control + V粘贴到md文档
以2020-04-07-templatetest.md文档为例子，粘贴后效果
image
![](/2020-04-07-templatetest/20200407110022073.png)
且在图片设置的默认资源库/cdn/images/下，自动生成复制的图片20200407110022073.png，且以文档文件名为相对目录。

md语法引用本地相对路径，本地预览可以看到图片，但发布到博客后，将加载不出来。
HexoEditor粘贴生成的图片名，仍以长时间串为格式，只能委屈接受了；如果图片名必须展示意义，就做个手动改名吧。。

image

采用Hexo标签插件语法，改造图片引用
1
2
label 七牛标签引用格式
{% qnimg /2020-04-07-templatetest/20200407110022073.png %}
使用七牛标签引用相对路径，本地预览看不到图片，但发布到博客后，可以正常显示图片，且自动转换为七牛图床对应的图片外链。
正常文档里，引用改造后，应删除md语法的图片引用。

label
完成博客撰写后，在GithubDesktop里，commit改动文档
1
2
git add .
git commit -m ""
Terminal终端执行git push修改到文档到服务器仓库
1
git push
发布博客
1
hexo d -g
七牛插件，上传图片到七牛图床
1
hexo qiniu s

结语

最后，谨以列出本文的目录结构致敬！

1	~/Development/hexo/shendawei/source/_posts/2020-04/2020-04-07-Hexo之高效编写文章.md