halo 博文增加代码块高亮强调某几行的效果

s8vozzvw  于 2022-10-21  发布在  其他
关注(0)|答案(7)|浏览(300)

你当前使用的版本

1.4.2

描述一下此特性

看到了之前的Vue文档,可以实现代码块里的高亮某行的效果,阅读体验比较好,是否考虑增加此功能?

效果如下图所示:

参考的链接:

Markdown 拓展 | VuePress 中文文档 | VuePress 中文网

有个开源库链接:
egoist/markdown-it-highlight-lines: Highlight specific lines in code blocks.

附加信息

目前的想法通过自定义主题实现,由前端获取原始md格式数据,进行md的渲染

brgchamk

brgchamk1#

感谢反馈,提供一下实现方案:

  1. markdown-renderer 中添加上述插件。
  2. halo-dev/editor 适配这个插件,包括升级 markdown-renderer 包和预览部分的样式。

这仅仅是提供了渲染阶段的修改方案。最终主题侧也需要针对这个特性进行适配。

/kind feature
/milestone 1.6.x

@stars-one 是否愿意来实现这个特性呢😀

cygmwpex

cygmwpex2#

心有余力不足,前端这块不是很懂,我只是初级入门 😂

ghhaqwfi

ghhaqwfi3#

心有余力不足,前端这块不是很懂,我只是初级入门 😂

Okay,晚点我会尝试一下。

/area admin

inb24sb2

inb24sb25#

这个特性我尝试了一下,似乎不是很好处理。因为目前关于代码块我们是直接保存的原格式,没有保存经过高亮渲染引擎(PrismJS、highlight.js 等)后的内容。如果要使用 https://github.com/egoist/markdown-it-highlight-lines 这个插件的话,那么就需要保存代码高亮渲染后的内容,否则在前台文章中也需要各个主题去处理。所以目前可能不会考虑去做这个修改,但不排除在后续大版本中会做这个改动(直接存储高亮渲染的代码块结构)。

/milestone 2.0

vmjh9lq9

vmjh9lq96#

这个特性我尝试了一下,似乎不是很好处理。因为目前关于代码块我们是直接保存的原格式,没有保存经过高亮渲染引擎(PrismJS、highlight.js 等)后的内容。如果要使用 https://github.com/egoist/markdown-it-highlight-lines 这个插件的话,那么就需要保存代码高亮渲染后的内容,否则在前台文章中也需要各个主题去处理。所以目前可能不会考虑去做这个修改,但不排除在后续大版本中会做这个改动(直接存储高亮渲染的代码块结构)。

/milestone 2.0

OK,辛苦辛苦

有点不太明确,目前版本,库中的数据是markdown格式还是html的格式?

bttbmeg0

bttbmeg07#

有点不太明确,目前版本,库中的数据是markdown格式还是html的格式?

@stars-one 目前都是保存了的,在 contents 表。

相关问题