有个问题哈,
getHTML 的结果被 html2md 转换的结果不正确,比如:
- 部分代码块的的标识转换没了
这应该是 lute 通用的转换函数所至,
时间有限, 还未阅读全部文档,
有哪位大佬有这两个 api 无损转换的例子吗
有个问题哈,
getHTML 的结果被 html2md 转换的结果不正确,比如:
这应该是 lute 通用的转换函数所至,
时间有限, 还未阅读全部文档,
有哪位大佬有这两个 api 无损转换的例子吗
我目前有三个方案,
html2md
前处理 html 字符串,<div class="language-mindmap">- 教程</div>
转换成 <pre><code class="language-mindmap">- 教程</code></pre>
export const getHTML = (vditor: IVditor) => {
if (vditor.currentMode === "sv") {
return vditor.lute.Md2HTML(getMarkdown(vditor));
} else if (vditor.currentMode === "wysiwyg") {
return vditor.lute.VditorDOM2HTML(vditor.wysiwyg.element.innerHTML);
} else if (vditor.currentMode === "ir") {
return vditor.lute.VditorIRDOM2HTML(vditor.ir.element.innerHTML);
}
};
HTML2Md
方法,对 md 的转换规则做特殊支持我用的是 第一个方案
function transformHtml(html) {
const box = document.createElement('div');
box.innerHTML = html;
const supMap = {};
// 注意: 有先后顺序,脚注也可以包含自定义区块
const selector = [
// sup: class="footnotes-ref"
{
css: 'sup.footnotes-ref',
convert: (node) => {
const a = node.querySelector('a');
const href = a && a.getAttribute('href');
const [_, id] = /#(.+)/g.exec(href) || [];
const mark = a.innerText;
supMap[id] = mark;
node.outerHTML = `[^${mark}]`;
}
},
// supDefs:,
{
css: 'div.footnotes-defs-div',
convert: (node) => {
let defIndex = 1;
const defs = node.querySelectorAll('.footnotes-defs-ol>li');
const refs = node.querySelectorAll('.footnotes-defs-ol .vditor-footnotes__goto-ref');
// 去掉内容的跳转
refs.forEach(node => node.outerHTML = '');
const result = Array.from(defs).map(li => {
const id = node.getAttribute('id');
// 注意这里的div,不加这层容器解释的内容不正确
return `<div>[^${supMap[id] || defIndex++}]: ${li.innerHTML}</div>`;
}).join('');
node.outerHTML = result;
}
},
// customCode
{
// language-math
css: 'div[class^="language-"]',
convert: (node) => {
const clsName = node.getAttribute('class');
const [_, language] = /\blanguage-([^\s]+)/g.exec(clsName);
let str = '';
switch (language) {
case 'math':
str = `$$
${node.innerText}
$$`
break;
default:
str = `<pre><code class="${clsName}" >${node.innerHTML}</code></pre>`
}
node.outerHTML = str;
}
}
]
selector.forEach(({ css, convert }) => {
box.querySelectorAll(css).forEach(convert)
});
return box.innerHTML;
}
Quicker 您的指尖工具箱!操作更少,收获更多!
AngularJS 诞生于 2009 年,由 Misko Hevery 等人创建,后为 Google 所收购。是一款优秀的前端 JS 框架,已经被用于 Google 的多款产品当中。AngularJS 有着诸多特性,最为核心的是:MVC、模块化、自动化双向数据绑定、语义化标签、依赖注入等。2.0 版本后已经改名为 Angular。
1999 年 2 月腾讯正式推出“腾讯 QQ”,在线用户由 1999 年的 2 人(马化腾和张志东)到现在已经发展到上亿用户了,在线人数超过一亿,是目前使用最广泛的聊天软件之一。
Pipe 是一款小而美的开源博客平台。Pipe 有着非常活跃的社区,可将文章作为帖子推送到社区,来自社区的回帖将作为博客评论进行联动(具体细节请浏览 B3log 构思 - 分布式社区网络)。
这是一种全新的网络社区体验,让热爱记录和分享的你不再感到孤单!
锤子科技(Smartisan)成立于 2012 年 5 月,是一家制造移动互联网终端设备的公司,公司的使命是用完美主义的工匠精神,打造用户体验一流的数码消费类产品(智能手机为主),改善人们的生活质量。
i18n(其来源是英文单词 internationalization 的首末字符 i 和 n,18 为中间的字符数)是“国际化”的简称。对程序来说,国际化是指在不修改代码的情况下,能根据不同语言及地区显示相应的界面。
Eclipse 是一个开放源代码的、基于 Java 的可扩展开发平台。就其本身而言,它只是一个框架和一组服务,用于通过插件组件构建开发环境。
Logseq 是一个隐私优先、开源的知识库工具。
Logseq is a joyful, open-source outliner that works on top of local plain-text Markdown and Org-mode files. Use it to write, organize and share your thoughts, keep your to-do list, and build your own digital garden.
OpenStack 是一个云操作系统,通过数据中心可控制大型的计算、存储、网络等资源池。所有的管理通过前端界面管理员就可以完成,同样也可以通过 Web 接口让最终用户部署资源。
大数据(big data)是指无法在一定时间范围内用常规软件工具进行捕捉、管理和处理的数据集合,是需要新处理模式才能具有更强的决策力、洞察发现力和流程优化能力的海量、高增长率和多样化的信息资产。
Chrome 又称 Google 浏览器,是一个由谷歌公司开发的网页浏览器。该浏览器是基于其他开源软件所编写,包括 WebKit,目标是提升稳定性、速度和安全性,并创造出简单且有效率的使用者界面。
星云链是一个开源公链,业内简单的将其称为区块链上的谷歌。其实它不仅仅是区块链搜索引擎,一个公链的所有功能,它基本都有,比如你可以用它来开发部署你的去中心化的 APP,你可以在上面编写智能合约,发送交易等等。3 分钟快速接入星云链 (NAS) 测试网
前端技术一般分为前端设计和前端开发,前端设计可以理解为网站的视觉设计,前端开发则是网站的前台代码实现,包括 HTML、CSS 以及 JavaScript 等。
小薇是一个用 Java 写的 QQ 聊天机器人 Web 服务,可以用于社群互动。
由于 Smart QQ 从 2019 年 1 月 1 日起停止服务,所以该项目也已经停止维护了!
发布对别人有帮助的原创内容是最好的 SEO 方式。
服务器,也称伺服器,是提供计算服务的设备。由于服务器需要响应服务请求,并进行处理,因此一般来说服务器应具备承担服务并且保障服务的能力。
有点意思就行了
VirtualBox 是一款开源虚拟机软件,最早由德国 Innotek 公司开发,由 Sun Microsystems 公司出品的软件,使用 Qt 编写,在 Sun 被 Oracle 收购后正式更名成 Oracle VM VirtualBox。
RabbitMQ 是一个开源的 AMQP 实现,服务器端用 Erlang 语言编写,支持多种语言客户端,如:Python、Ruby、.NET、Java、C、PHP、ActionScript 等。用于在分布式系统中存储转发消息,在易用性、扩展性、高可用性等方面表现不俗。
Cloud Foundry 是 VMware 推出的业界第一个开源 PaaS 云平台,它支持多种框架、语言、运行时环境、云平台及应用服务,使开发人员能够在几秒钟内进行应用程序的部署和扩展,无需担心任何基础架构的问题。
支付宝是全球领先的独立第三方支付平台,致力于为广大用户提供安全快速的电子支付/网上支付/安全支付/手机支付体验,及转账收款/水电煤缴费/信用卡还款/AA 收款等生活服务应用。
etcd 是一个分布式、高可用的 key-value 数据存储,专门用于在分布式系统中保存关键数据。
flomo 是新一代 「卡片笔记」 ,专注在碎片化时代,促进你的记录,帮你积累更多知识资产。
C 语言是一门通用计算机编程语言,应用广泛。C 语言的设计目标是提供一种能以简易的方式编译、处理低级存储器、产生少量的机器码以及不需要任何运行环境支持便能运行的编程语言。
Openfire 是开源的、基于可拓展通讯和表示协议 (XMPP)、采用 Java 编程语言开发的实时协作服务器。Openfire 的效率很高,单台服务器可支持上万并发用户。
欢迎来到这里!
我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。
注册 关于