前段时间上网冲浪的时候突然想到，做个像 workflowy 一样的主页也不错，所有内容都放在同一个页面里，一层层点击展开，渐入佳境（唯一的问题是对手机流量上网不友好）。既然 workflowy 自带导出功能，思路自然是把 workflowy 本身作为内容编辑器，再写脚本修改 html 文件。稍加研究后就实现了，在此记录下实现过程。

首先，是导出要发布的节点为 html 格式：

这个 html 直接打开是这样的：

需要改动的无非是把所有节点都折叠起来，也就是把所有 <li> 标签改成 <details> 标签，并给节点的主体部分加上 <summary>。

那么研究了一下导出文件的结构，用 python 的正则加以替换：

def add_details(filepath):
    p1 = u'<li><span class="name">(.*?)</span></span>'
    r1 = u'<li><details><summary class="name">\\1</span></summary>'
    p2 = u'</li>'
    r2 = u'</details></li>'
    lines = []
    with open(filepath, 'r', encoding='UTF-8') as f:
        lines = f.readlines()
    newlines = ''.join(lines)
    newlines = re.sub(p1, r1, newlines, flags=re.UNICODE|re.DOTALL)
    newlines = re.sub(p2, r2, newlines, flags=re.UNICODE|re.DOTALL)
    with open(filepath, 'w', encoding='UTF-8') as f
        f.writelines(newlines)

 

这里要注意的是 python 默认 \ 是 escape 符号，但 \1 又是正则表达式里的参数，所以要再 escape 一次，写作 \\1。

最后写入一点 css 进行修饰，就完成了：

示例站点：https://idelem.github.io/flowy/

python 脚本：https://gist.github.com/idelem/34eaffe04d62cf8577804eaaa344918b

0
0