在GitHub上用Evernote+Hexo搭建个人静态博客

Edit

写博客的想法由来已久,更多的分享才有更多的获得。因为平时GitHub用的很多,所以选择在GitHub上搭建博客。一开始看到的是Jekyll,后来看到用Hexo的帖子,觉得Hexo也不错,于是就选定从Hexo开始了。
因为平时多用Evernote记录各种读书笔记,折腾历程,所以希望能找到一个直接用Evernote中笔记作为blog post的工具。最后在npm上发现了everblog,正好符合自己的需求,但当然免不了各种踩坑。好在最后顺利解决。本文会有所记录。

在GitHub上搭建Hexo博客

在google上一搜一大摞。贴出我参考的链接手把手教你使用Hexo + Github Pages搭建个人独立博客

简单来说就是:

  1. 在GitHub上注册一个如此命名的repo: <username>.github.io, e.g. zhougy0717.github.io
  2. 用hexo工具来初始化这个repo
  3. blog所有的配置信息都在_config.yml文件中,包括deploy的信息
deploy:
type: git
repo: https://github.com/zhougy0717/zhougy0717.github.io.git
branch: master
  1. 所有的post在source/_posts

Hexo的逻辑是在_posts下用Markdown写博客,然后调用hexo g对Markdown post进行渲染生成html,最后调用hexo s将生成的网页版post发布到GitHub上去,从而可以用.github.io的域名访问到该博客。

Everblog

项目地址: everblog
使用方法:

  1. npm install everblog -g
  2. 在主目录下添加.everblogrc,包含字段:
    • token
    • noteStoreUrl
    • notebook
  3. 在blog根目录下添加index.js
module.exports = require('everblog-adaptor-hexo-html')
  1. 在blog根目录下运行everblog build
  2. hexo s测试,hexo d部署

踩坑记录

EDAMSystemException: authenticationToken

各种翻看Evernote API和Evernote Nodejs SDK, 最后还是用代码单步得知,是serviceHost的问题。servicceHost默认采用”www.evernote.com”。而这个值是可以传给Evernote.Client的。而由于everblog将.everblogrc中的值直接传给Evernote.Client,所以我们可以在.everblogrc中添加serviceHost值。这样就可以成功build了。

HTML based Hexo blog

由于Hexo的原生逻辑是用Markdown写blog,而前文提到,本次搭建博客希望基于Evernote。这样每次用马克飞象写完笔记后,直接发布就可以了。但Windows下类MWeb的工具都得付钱。而且这些工具包括MWeb,都需自行维护笔记原始资源,然后将渲染后的Markdown发布到各Web Service。所以,还是希望能保留Evernote + 马克飞象工作方式。
everblog自带的adaptor是everblog-adaptor-hexo,其工作方式是导出笔记中的纯文本,然后生成Markdown文件发布。其基于everblog作者的另外一个project——enml2text。everblog作者还有一个project——enml2html。
于是最后的解决方式是,对笔记的content,调用enml2html生成html文件。但有一个问题,生成的html的文件无法显示图片。
这是因为enml2html生成图片路径的方式过期了,根据Evernote developer网页的方法,进行了更新并提交了pull request。

这时仍然有另一个问题,就是印象笔记的图片是不允许外链的。也就是在你没登录印象笔记网页用户的时候,博客里面的图片统统不能显示。于是乎,就只能将图片下载到本地,并在img src字段进行标注,来实现显示图片了。

本地图片显示

承接上文。幸运的是,网上是有这种需求的。于是搜到这篇网页:Hexo框架下给博客插入本地图片。于是基于这个网页中提到的方法,修改everblog-adaptor-hexo实现下载网页并能显示图片。但inline图片(MathJax渲染的公式图片)尺寸变得很大,查了一下evernote客户端导出的html,这些图片都得到了一定程度的缩放。不知道其缩放逻辑是什么。不想那么多,于是我对所有__SVG__开头的图片都进行了47.5%的缩小。

引用文字中对齐问题

Hexo theme的问题。试了几个them,最终用的是freemind没有这个问题。

%23%20%u5728GitHub%u4E0A%u7528Evernote+Hexo%u642D%u5EFA%u4E2A%u4EBA%u9759%u6001%u535A%u5BA2%0A@%28myblog%29%5Bhexo%2C%20GitHub%5D%0A%0A%5BTOC%5D%0A%0A%u5199%u535A%u5BA2%u7684%u60F3%u6CD5%u7531%u6765%u5DF2%u4E45%uFF0C%u66F4%u591A%u7684%u5206%u4EAB%u624D%u6709%u66F4%u591A%u7684%u83B7%u5F97%u3002%u56E0%u4E3A%u5E73%u65F6GitHub%u7528%u7684%u5F88%u591A%uFF0C%u6240%u4EE5%u9009%u62E9%u5728GitHub%u4E0A%u642D%u5EFA%u535A%u5BA2%u3002%u4E00%u5F00%u59CB%u770B%u5230%u7684%u662FJekyll%uFF0C%u540E%u6765%u770B%u5230%u7528Hexo%u7684%u5E16%u5B50%uFF0C%u89C9%u5F97Hexo%u4E5F%u4E0D%u9519%uFF0C%u4E8E%u662F%u5C31%u9009%u5B9A%u4ECEHexo%u5F00%u59CB%u4E86%u3002%0A%u56E0%u4E3A%u5E73%u65F6%u591A%u7528Evernote%u8BB0%u5F55%u5404%u79CD%u8BFB%u4E66%u7B14%u8BB0%uFF0C%u6298%u817E%u5386%u7A0B%uFF0C%u6240%u4EE5%u5E0C%u671B%u80FD%u627E%u5230%u4E00%u4E2A%u76F4%u63A5%u7528Evernote%u4E2D%u7B14%u8BB0%u4F5C%u4E3Ablog%20post%u7684%u5DE5%u5177%u3002%u6700%u540E%u5728npm%u4E0A%u53D1%u73B0%u4E86everblog%uFF0C%u6B63%u597D%u7B26%u5408%u81EA%u5DF1%u7684%u9700%u6C42%uFF0C%u4F46%u5F53%u7136%u514D%u4E0D%u4E86%u5404%u79CD%u8E29%u5751%u3002%u597D%u5728%u6700%u540E%u987A%u5229%u89E3%u51B3%u3002%u672C%u6587%u4F1A%u6709%u6240%u8BB0%u5F55%u3002%0A%0A%23%23%20%u5728GitHub%u4E0A%u642D%u5EFAHexo%u535A%u5BA2%0A%u5728google%u4E0A%u4E00%u641C%u4E00%u5927%u645E%u3002%u8D34%u51FA%u6211%u53C2%u8003%u7684%u94FE%u63A5%5B%u624B%u628A%u624B%u6559%u4F60%u4F7F%u7528Hexo%20+%20Github%20Pages%u642D%u5EFA%u4E2A%u4EBA%u72EC%u7ACB%u535A%u5BA2%5D%28https%3A//linghucong.js.org/2016/04/15/2016-04-15-hexo-github-pages-blog/%29%0A%0A%u7B80%u5355%u6765%u8BF4%u5C31%u662F%uFF1A%0A1.%20%u5728GitHub%u4E0A%u6CE8%u518C%u4E00%u4E2A%u5982%u6B64%u547D%u540D%u7684repo%3A%20%26lt%3Busername%26gt%3B.github.io%2C%20e.g.%20zhougy0717.github.io%0A2.%20%u7528hexo%u5DE5%u5177%u6765%u521D%u59CB%u5316%u8FD9%u4E2Arepo%0A3.%20blog%u6240%u6709%u7684%u914D%u7F6E%u4FE1%u606F%u90FD%u5728_config.yml%u6587%u4EF6%u4E2D%uFF0C%u5305%u62ECdeploy%u7684%u4FE1%u606F%0A%60%60%60yaml%0Adeploy%3A%0A%20%20type%3A%20git%0A%20%20repo%3A%20https%3A//github.com/zhougy0717/zhougy0717.github.io.git%0A%20%20branch%3A%20master%0A%60%60%60%0A4.%20%u6240%u6709%u7684post%u5728%60source/_posts%60%u4E0B%0A%0AHexo%u7684%u903B%u8F91%u662F%u5728_posts%u4E0B%u7528Markdown%u5199%u535A%u5BA2%uFF0C%u7136%u540E%u8C03%u7528%60hexo%20g%60%u5BF9Markdown%20post%u8FDB%u884C%u6E32%u67D3%u751F%u6210html%uFF0C%u6700%u540E%u8C03%u7528%60hexo%20s%60%u5C06%u751F%u6210%u7684%u7F51%u9875%u7248post%u53D1%u5E03%u5230GitHub%u4E0A%u53BB%uFF0C%u4ECE%u800C%u53EF%u4EE5%u7528.github.io%u7684%u57DF%u540D%u8BBF%u95EE%u5230%u8BE5%u535A%u5BA2%u3002%0A%0A%23%23Everblog%0A%u9879%u76EE%u5730%u5740%3A%20%5Beverblog%5D%28https%3A//github.com/everblogjs/everblog%29%0A%u4F7F%u7528%u65B9%u6CD5%uFF1A%0A1.%20npm%20install%20everblog%20-g%0A2.%20%u5728%u4E3B%u76EE%u5F55%u4E0B%u6DFB%u52A0.everblogrc%uFF0C%u5305%u542B%u5B57%u6BB5%uFF1A%0A%09-%20token%0A%09-%20noteStoreUrl%0A%09-%20notebook%0A3.%20%u5728blog%u6839%u76EE%u5F55%u4E0B%u6DFB%u52A0index.js%0A%60%60%60%20javascript%0Amodule.exports%20%3D%20require%28%27everblog-adaptor-hexo-html%27%29%0A%60%60%60%0A3.%20%u5728blog%u6839%u76EE%u5F55%u4E0B%u8FD0%u884C%60everblog%20build%60%0A4.%20%60hexo%20s%60%u6D4B%u8BD5%uFF0C%60hexo%20d%60%u90E8%u7F72%0A%0A%23%23%23%20%u8E29%u5751%u8BB0%u5F55%0A%23%23%23%23EDAMSystemException%3A%20authenticationToken%0A%u5404%u79CD%u7FFB%u770BEvernote%20API%u548CEvernote%20Nodejs%20SDK%uFF0C%20%u6700%u540E%u8FD8%u662F%u7528%u4EE3%u7801%u5355%u6B65%u5F97%u77E5%uFF0C%u662FserviceHost%u7684%u95EE%u9898%u3002servicceHost%u9ED8%u8BA4%u91C7%u7528%22www.evernote.com%22%u3002%u800C%u8FD9%u4E2A%u503C%u662F%u53EF%u4EE5%u4F20%u7ED9Evernote.Client%u7684%u3002%u800C%u7531%u4E8Eeverblog%u5C06.everblogrc%u4E2D%u7684%u503C%u76F4%u63A5%u4F20%u7ED9Evernote.Client%uFF0C%u6240%u4EE5%u6211%u4EEC%u53EF%u4EE5%u5728.everblogrc%u4E2D%u6DFB%u52A0serviceHost%u503C%u3002%u8FD9%u6837%u5C31%u53EF%u4EE5%u6210%u529Fbuild%u4E86%u3002%0A%0A%23%23%23%23HTML%20based%20Hexo%20blog%0A%u7531%u4E8EHexo%u7684%u539F%u751F%u903B%u8F91%u662F%u7528Markdown%u5199blog%uFF0C%u800C%u524D%u6587%u63D0%u5230%uFF0C%u672C%u6B21%u642D%u5EFA%u535A%u5BA2%u5E0C%u671B%u57FA%u4E8EEvernote%u3002%u8FD9%u6837%u6BCF%u6B21%u7528%u9A6C%u514B%u98DE%u8C61%u5199%u5B8C%u7B14%u8BB0%u540E%uFF0C%u76F4%u63A5%u53D1%u5E03%u5C31%u53EF%u4EE5%u4E86%u3002%u4F46Windows%u4E0B%u7C7BMWeb%u7684%u5DE5%u5177%u90FD%u5F97%u4ED8%u94B1%u3002%u800C%u4E14%u8FD9%u4E9B%u5DE5%u5177%u5305%u62ECMWeb%uFF0C%u90FD%u9700%u81EA%u884C%u7EF4%u62A4%u7B14%u8BB0%u539F%u59CB%u8D44%u6E90%uFF0C%u7136%u540E%u5C06%u6E32%u67D3%u540E%u7684Markdown%u53D1%u5E03%u5230%u5404Web%20Service%u3002%u6240%u4EE5%uFF0C%u8FD8%u662F%u5E0C%u671B%u80FD%u4FDD%u7559Evernote%20+%20%u9A6C%u514B%u98DE%u8C61%u5DE5%u4F5C%u65B9%u5F0F%u3002%0Aeverblog%u81EA%u5E26%u7684adaptor%u662Feverblog-adaptor-hexo%uFF0C%u5176%u5DE5%u4F5C%u65B9%u5F0F%u662F%u5BFC%u51FA%u7B14%u8BB0%u4E2D%u7684%u7EAF%u6587%u672C%uFF0C%u7136%u540E%u751F%u6210Markdown%u6587%u4EF6%u53D1%u5E03%u3002%u5176%u57FA%u4E8Eeverblog%u4F5C%u8005%u7684%u53E6%u5916%u4E00%u4E2Aproject%u2014%u2014enml2text%u3002everblog%u4F5C%u8005%u8FD8%u6709%u4E00%u4E2Aproject%u2014%u2014enml2html%u3002%0A%u4E8E%u662F%u6700%u540E%u7684%u89E3%u51B3%u65B9%u5F0F%u662F%uFF0C%u5BF9%u7B14%u8BB0%u7684content%uFF0C%u8C03%u7528enml2html%u751F%u6210html%u6587%u4EF6%u3002%u4F46%u6709%u4E00%u4E2A%u95EE%u9898%uFF0C%u751F%u6210%u7684html%u7684%u6587%u4EF6%u65E0%u6CD5%u663E%u793A%u56FE%u7247%u3002%0A%u8FD9%u662F%u56E0%u4E3Aenml2html%u751F%u6210%u56FE%u7247%u8DEF%u5F84%u7684%u65B9%u5F0F%u8FC7%u671F%u4E86%uFF0C%u6839%u636EEvernote%20developer%u7F51%u9875%u7684%u65B9%u6CD5%uFF0C%u8FDB%u884C%u4E86%u66F4%u65B0%u5E76%u63D0%u4EA4%u4E86pull%20request%u3002%0A%0A%u8FD9%u65F6%u4ECD%u7136%u6709%u53E6%u4E00%u4E2A%u95EE%u9898%uFF0C%u5C31%u662F%u5370%u8C61%u7B14%u8BB0%u7684%u56FE%u7247%u662F%u4E0D%u5141%u8BB8%u5916%u94FE%u7684%u3002%u4E5F%u5C31%u662F%u5728%u4F60%u6CA1%u767B%u5F55%u5370%u8C61%u7B14%u8BB0%u7F51%u9875%u7528%u6237%u7684%u65F6%u5019%uFF0C%u535A%u5BA2%u91CC%u9762%u7684%u56FE%u7247%u7EDF%u7EDF%u4E0D%u80FD%u663E%u793A%u3002%u4E8E%u662F%u4E4E%uFF0C%u5C31%u53EA%u80FD%u5C06%u56FE%u7247%u4E0B%u8F7D%u5230%u672C%u5730%uFF0C%u5E76%u5728img%20src%u5B57%u6BB5%u8FDB%u884C%u6807%u6CE8%uFF0C%u6765%u5B9E%u73B0%u663E%u793A%u56FE%u7247%u4E86%u3002%0A%0A%23%23%23%23%u672C%u5730%u56FE%u7247%u663E%u793A%0A%u627F%u63A5%u4E0A%u6587%u3002%u5E78%u8FD0%u7684%u662F%uFF0C%u7F51%u4E0A%u662F%u6709%u8FD9%u79CD%u9700%u6C42%u7684%u3002%u4E8E%u662F%u641C%u5230%u8FD9%u7BC7%u7F51%u9875%uFF1A%5BHexo%u6846%u67B6%u4E0B%u7ED9%u535A%u5BA2%u63D2%u5165%u672C%u5730%u56FE%u7247%5D%28https%3A//app.yinxiang.com/shard/s10/nl/161681/bee73bb9-bb81-45e9-b480-5260a70d3034%29%u3002%u4E8E%u662F%u57FA%u4E8E%u8FD9%u4E2A%u7F51%u9875%u4E2D%u63D0%u5230%u7684%u65B9%u6CD5%uFF0C%u4FEE%u6539everblog-adaptor-hexo%u5B9E%u73B0%u4E0B%u8F7D%u7F51%u9875%u5E76%u80FD%u663E%u793A%u56FE%u7247%u3002%u4F46inline%u56FE%u7247%uFF08MathJax%u6E32%u67D3%u7684%u516C%u5F0F%u56FE%u7247%uFF09%u5C3A%u5BF8%u53D8%u5F97%u5F88%u5927%uFF0C%u67E5%u4E86%u4E00%u4E0Bevernote%u5BA2%u6237%u7AEF%u5BFC%u51FA%u7684html%uFF0C%u8FD9%u4E9B%u56FE%u7247%u90FD%u5F97%u5230%u4E86%u4E00%u5B9A%u7A0B%u5EA6%u7684%u7F29%u653E%u3002%u4E0D%u77E5%u9053%u5176%u7F29%u653E%u903B%u8F91%u662F%u4EC0%u4E48%u3002%u4E0D%u60F3%u90A3%u4E48%u591A%uFF0C%u4E8E%u662F%u6211%u5BF9%u6240%u6709%60__SVG__%60%u5F00%u5934%u7684%u56FE%u7247%u90FD%u8FDB%u884C%u4E8647.5%25%u7684%u7F29%u5C0F%u3002%0A%0A%23%23%23%23%u5F15%u7528%u6587%u5B57%u4E2D%u5BF9%u9F50%u95EE%u9898%0AHexo%20theme%u7684%u95EE%u9898%u3002%u8BD5%u4E86%u51E0%u4E2Athem%uFF0C%u6700%u7EC8%u7528%u7684%u662Ffreemind%u6CA1%u6709%u8FD9%u4E2A%u95EE%u9898%u3002