文章如何保存为markdown?下面推荐2个工具,非常好用,可以直接将HTML转markdown。可以收藏使用https://devtool.tech/html-mdhttps://www.helloworld.net/html2mddevtool.tech其实devtool.tech里面的每一个工具都非常好用。如何将HTML转换为markdown?其实有个包turndown可以直接把html转markdown,在浏览器和nodejs中都可以安装。npmnpminstallturndownbrowser使用varTurndownService=require('turndown')varturndownService=newTurndownService()varmarkdown=turndownService.turndown('
Helloworld!
')直接传入html字符串即可,返回markdown字符串turndown也支持配置规则,比如保留标签turndownService.keep(['del','ins'])turndownService.turndown('
HelloworldWorld
')//'Hello
worldWorld'移除标签turndownService.remove('del')turndownService.turndown('
HelloworldWorld
')//'HelloWorld'插件turndown也支持使用插件,官方提供了turndown-plugin-gfm,意思是GitHubFlavoredMarkdownfeatures:strikethroughsupport,,andlabels,即删除线表支持表taskListItems支持任务列表,即checkbox任务使用代码varTurndownService=require('turndown')varturndownPluginGfm=require('turndown-plugin-gfm')vargfm=turndownPluginGfm.gfmvarturndownService=newTurndownService()turndownService.use(gfm)varmarkdown=turndownService.turndown('<罢工>Helloworld!')一般开发类似的工具都需要添加这个插件。其实类似的功能已经用turndown完成了。为了美观,我们可以在代码中加入代码编辑器codemirror。新的codemirror6完全重写。采用插件形式,代码量更小。我用的技术栈是react,社区封装了一个好用的库rodemirror。从“react”导入{useMemo,useState};从“rodemirror”导入CodeMirror;从“@codemirror/basic-setup”导入{basicSetup};从“@codemirror/theme-one-dark”导入{oneDark};导入{javascript}from"@codemirror/lang-javascript";import{markdownaslangMarkdown}from"@codemirror/lang-markdown";constEditor=()=>{constextensions=useMemo(()=>[basicSetup,oneDark,javascript(),langMarkdown(),[]);constdefaultValue="console.log('Helloworld!')";//如果不需要该值,则删除const[value,setValue]=useState(defaultValue);回报(};导出默认编辑器;lang-javascript下的包使CodeMirror支持语法高亮。接下来就是配合react的常规写法了。效果总结如下。实现了一个简单版本的html转markdown编辑器。您可以尝试手动实现它。本文不涉及这些工具的内部实现原理,以后遇到问题还需要进一步研究。Tips常规方法是使用chrome控制台选择article标签直接复制html,但有时如果html不规范,可能会转换失败。有时候有些文章,文章不在同一个tag,比如medium.com的文章不在同一个tag,这时候要copyhtml就麻烦了。还有一个问题,Word中的文档怎么转换成markdown呢?其实我们可以直接选中文字然后粘贴到typora,然后直接转成markdown。所以说了这么多,我还没有开发这个工具