最近几年涌现出了很多技术博客和技术社区, 也有很多技术同仁开始打造自己的博客, 我们可以把自己的博客同步到不同的技术平台, 但是随着技术平台的增多, 我们文章同步所花费的时间会越来越多, 那么有没有一个工具能快速的将博客发布到不同的平台呢? 或者有没有一个工具, 可以把html直接转化为技术平台能够识别的“语言”直接发布呢?
我们都知道程序员最爱的写博客的“语言”就是makedown, 并且目前大部分的技术社区都支持makedown语法, 所以说只要有makedown, 我们就能快速的同步到不同的技术平台.
也许有人会说, 我们写博客直接用makedown语法写不就好了? 的确这样做可以满足需求, 但缺点就是我们本地必须要保存一份makedown文件, 如果博客内容涉及到图片, 我们还需要维护一个img目录, 这样每次在不同技术社区发布文章还是会很麻烦, 所以综上我们开发了一款自动爬取html内容并一键转换为makedown的工具, 这样我们就可以“肆无忌惮的”发布博客了.
你将收获
github地址笔者将在文末附上, 感兴趣的朋友可以一起共建, 学习和探索.
效果演示
客户端
思路
先理一下思路：
为什么选择 turndown
客户端最重要的一步是 html 转 md，这里我们使用的 turndown。
为什么使用 turndown 呢，原因如下：
具体实现
// 引入第三方插件
import { gfm, tables, strikethrough } from 'turndown-plugin-gfm'
const turndownService = new TurndownService({ codeBlockStyle: 'fenced' })
// Use the gfm plugin
turndownService.use(gfm)
// Use the table and strikethrough plugins only
turndownService.use([tables, strikethrough])
/**
* 自定义配置（rule名不能重复）
* 这里我们指定 `pre` 标签为代码块，并在代码块的前后加个换行，防止显示异常
*/
turndownService.addRule('pre2Code', {
filter: ['pre'],
replacement (content) {
return '```\n' + content + '\n```'
}
})
额外功能
支持自动获取链接文章标题，无需手动去原文复制。
服务端
这里我们使用的服务端是 node.js，用前端的框架写服务端，体验杠杠的。
思路
先理一下思路：
具体实现
实际应用
这个开源工具的应用场景非常广泛, 我们几乎可以将任何网页链接转换为md内容, 同步到自己的博客或者内容管理平台, 但是大家需要有版权意识, 做一个遵纪守法的好“网民”.
支持环境
现代浏览器及 IE11。
参与贡献
我们非常欢迎你的贡献，你可以通过以下方式和我们一起共建 😃
本文分享自微信公众号 - 趣谈前端（beautifulFront）。
如有侵权，请联系 [email protected] 删除。
本文参与“OSC源创计划”，欢迎正在阅读的你也加入，一起分享。