Hexo博客折腾

最近拖延症发作,心血来潮又折腾起了GitHub Pages 博客,而且灵机一动,改选了Hexo来搭建,打开了新世界的大门。

一、从Jekyll到Hexo

去年折腾过GitHub Pages博客,可惜由于问题重重,最终热情消耗完就没继续下去了:

1. 错选了Jekyll

Jekyll 如果要在本地生成站点,就要安装Ruby。Ruby一点都不了解,而且对Windows不友好

Jekyll最终是在GitHub生成页面,生成的速度有时慢。但最终让我放弃的是,多个gh-pages出现了不明原因的错误:

Your site is having problems building: Page build timed out. Please try again later.

发邮件给GitHub求助,发现问题居然是一个MD文件中的一行中文字引起的,而且原因未知。

Thanks for your patience while we're looking into this. We've been able to narrow the problem down to this post:

https://github.com/chchuj/jekyll-minimal-theme/blob/gh-pages/_posts/2016-06-06-fanqiang.md

Specifically, this line:

"是一款墙内也能获取的软件,只需往赛风官网提供的邮箱get@psiphon3.com发送任意邮件,立马就能收到自动回复。在回信中,直接就附上了赛风的可执行程序(如果邮件里的附件名叫“psiphon3.asc”,改为“psiphon3.exe”即可直接运行"

There's something in there that's causing our parser to freeze, and we're not quite sure why yet, but we'll be in touch as we figure out more details.

当时工作人员邀请我继续研究这个问题,当时是放弃了。过了一年,发现问题依然存在,而且出了更奇怪的bug。

相反,Hexo用的JavaScript我学过基础,而且Windows友好,本地编译速度快(第一次在本地local预览成功时非常激动);还是台湾人建的,有中文文档。搜索了一下,发现使用的人不少,很多问题都可以在中文搜索结果中找到答案。

Google 搜索“jekyll 还是hexo”,可以看到一堆选Hexo的。

2. 选错了模板

知乎被顶到最上方的是一个实际上非常难用的模板:https://github.com/Huxpro/huxpro.github.io

教程写得也很糟糕,操作起来很麻烦。

其他的Jekyll模板也多是年久失修,还有什么Jekyll的版本问题。

相反

网上搜了一下后,发现hexo可以实现本地预览的功能,就决定用hexo来搭,next这个主题是个比较经典的主题,作者的维护也一直很棒,甚至出了一个用户手册,基本能实现我的所有需求。

-- other--博客从jekyll搬到hexo记录

Hexo nexT这个主题内置多种模块,通过修改参数开关就能简单配置,可以快速上手。

3. 选错了教程

除了https://github.com/Huxpro/huxpro.github.io 的糟糕的README之外,被SEO到最上面的GitHub Pages教程是陈素封的《如何搭建一个独立博客——简明 GitHub Pages与 jekyll 教程》(现在发现改为Hexo教程了)。根据该教程,部署博客要安装一堆软件,而其中一个GitHub Desktop非常大,下载要翻敏感词墙,下载到了也没安装成功。

而Hexo的教程推荐的都是Git+Node.js,Git很小,36.7M,Node.js 我下载的LTS v8.9.1,15.9M不大。《GitHub+Hexo 搭建个人网站详细教程》这篇教程写得非常好,跟着它成功入坑。

4.想当然地下结论

其实去年Doge就推荐了Hexo,只不过当时很想当然地认真本地编译很麻烦,就直接跳过了。

二、Hexo折腾记录

根据《GitHub+Hexo 搭建个人网站详细教程》搭建时遇到了一些问题,花了2周的时间陆续解决了:

1.win 10 没有右键文件夹在此处打开命令窗口的功能

需要通过注册表添加,或者在地址栏键入cmd,或者建一个bat实现

2.卡在第一步npm install -g hexo-cli

这一步折腾很久,各种出错。原因包括npm被墙,使用taobao npm貌似也不行,解决方法是为cmd设置全局代理

3.hexo init blog出错

这一步也出错一堆。提示Failed to install dependencies. Please run 'npm install' manually!

搜索反复折腾,最后根据字面意思,要cd进入真正的json所在的文件夹。就是blog里面的blog。原因可能是因为没严格按这文章说的来,我是右键blog文件夹来运行命令行的。

E:\Computer\Blog>cd \computer\blog\blog

E:\Computer\Blog\blog>npm install

又出现这个错误↓

npm ERR! Please try running this command again as root/Administrator.

StackOverFlow里面的人讲了一样,试了一下

npm cache clean --f

就行了,不过那帖子里面说这是玄学,有的人第一次清就行,后面再出来用这招就不行了。

4.Coding.net和Github两地部署Hexo博客

博客预览成功,没兴奋多久,就发现我的username.github.io被墙了。考虑到我主面还是面向墙内用户,就同时部署到coding.net上。

还有一种解决方法是github repo里面的文章的MD 页面,hexo 原MD的图片相对地址上传到github无法预览,使CodeFalling/hexo-asset-image的插件能解决问题(这个插件也有问题的,有时路径是文件夹/图片,有时又直接用图片名引用)

这使我体会到,域名并不重要,个人IP、个人名牌者是最重要的。中国敏感词防火敏感词长城一发力,域名就报废了。像前阵力那些被封的公众号、营销号,重新注册了一个就复活了。

5.优化hexo博客的永久链接

根据《hexo链接持久化终极解决之道》和《HEXO的站内链接和永久链接》,我把文章的永久链接设定为“/日期-英文标题”的形式。在_config.yml中修改

root: /
# permalink: :title/
permalink: :year:month:day-:english_url/
permalink_defaults:
  english_url: essay

Front-matter里面写上英文标题:

title: Hexo博客折腾
english_url: play-with-hexo-blog
date: 2017-11-25 23:29:18
tags:
- hexo

这样的的MD文件和文章tittle都是中文的,再分配一个变量来起英文名,方便后期整理

这样所有网页堆在public根下,链接非常好看(域名/tittle),等到有1000个网页,再改为permalink: post/:urlname 放到post下面吧

6.在菜单中挂上了个人项目

主要是健康科普反中医敏感词

7. markdown中本地和线上图片自动传图床并替换链接

8. Hexo Next 主题点击加载 Disqus 和来必力双评论系统

9.Hexo Seo优化

然而百度SEO并没有生效,不知道是不是tk域名的问题

10.CloudFlare & Authy 两步认证的bug

GitHub Pages用了自定义域名就没有https了,想用CloudFlare加上https。一年没登录CF了,登录时卡在Authy验证码界面,最后发现是Authy与CF不同步的问题,Authy说是CF的锅,提交了验证信息,CF的support为了解除了2FA。但感觉坑还是在Authy这边,Authy android APP和chrome扩展显示的token不同步。

https是用CF的Page Rule实现的,而且开Page Rule就一定要用它的CDN。

11.hexo中所有文件的编码格式均是UTF-8

一旦有非utf-8编辑的文件,hexo生成的博客就有错,一般是直接不显示某些部分。使用EmEditor/Sublime Text/Typora/Python都可以指定编码。EmEditor最敏感,打开文字时编码不一样就立刻有提示,Sublime Text保存的时候在下面的信息栏有提示编码。

12.RSS同步到人人网?

经过反复测试,确定人人网日志导入仅支持http格式的rss(支持tk域名),不支持导入https,支持导入七牛中的atom.xml,不支持cloudflare CDN后的atom.xml

CF的https和CDN舍不得关,所以替代的解决方案是把atom.xml自动上传到七牛,覆盖到之前七牛中的atom.xml,来实现hexo blog→RSS→人人网的同步。先写了一个简单的脚本,后期再完善吧

13.Markdown绘制流程图

期间改编了一个Python脚本,想学人家画一个流程图,学习了一下在Markdown中用语法写流程图。Markdown本身不支持流程图,它是调用http://flowchart.js.org/的插件(Typora带了这个插件),而且hexo要安装https://github.com/bubkoo/hexo-filter-flowchart才能生成流程图,简书有流程图插件,知乎和微信公众号就没有了。

Markdown中绘制流程图实际上非常蛋疼,纯手工绘制,必须为每个框起一个名字、设置属性以及打上框中的文字内容,然后又要用文字为每一条连接线指定方向(从哪连哪),一旦语法或逻辑错误,直接渲染失败而且没有提示。流程图是自动生成、动态预览的,布置和字体大小不能自定义,流程图太大的时候字就被缩得很小

[图片上传失败...(image-9286c7-1512220606825)]

而且想修改某个元素时,没有自动跳转功能,要肉眼去代码堆里面找到对应的地方进行修改。

于是又研究对比了Xmind 8和M$ Visio 2016的流程图绘制,发现还是Visio好。

13.关于Markdown写作

Markdown 是一种轻量级标记语言,将格式与样式分开,方便进行各种CSS渲染及网络发布。实际上写作时也是使用各种快捷键和菜单,边写边格式化,而且由于格式少、语法严格,写作时会更加在意格式。就写作这一点,并没有比M$ Word更有优势,而且Word中的写作形式更自由,格式更自由,比如图片大小、各种排版、序号自动变、格式刷等等。

Word是一种富文本格式,包含的内容更多。因此,Markdown文件可以转为Word(Typora内置了Pandoc),而Word无法完美地转换为Markdown。这和PDF/Word之间的转换是一个道理。


博客折腾史:

知乎专栏不是一个好的博客平台

网易博客解封之折腾 - 知乎专栏

微信公众号开通原创赞赏功能

参考文章:

各种博客平台的比较:https://www.zhihu.com/question/21981094

What is the best solution for a personal blog?

other--博客从jekyll搬到hexo记录

原文发表于:

https://chchuj.coding.me/20171125-play-with-hexo-blog/

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 213,254评论 6 492
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 90,875评论 3 387
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 158,682评论 0 348
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 56,896评论 1 285
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 66,015评论 6 385
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 50,152评论 1 291
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,208评论 3 412
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 37,962评论 0 268
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,388评论 1 304
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,700评论 2 327
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,867评论 1 341
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,551评论 4 335
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,186评论 3 317
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,901评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,142评论 1 267
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 46,689评论 2 362
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 43,757评论 2 351

推荐阅读更多精彩内容