用 codemirror 小写了个 latex 公式的提示插件

最近推公式推的很烦,故写了此插件,希望能够加快一些推公式的效率,现在分享出来。插件名字叫 siyuan-plugin-enhance-editor,解压到插件文件夹就能用。

siyuanpluginenhanceeditor.zip

基本功能

打开插件后,进入单独编辑代码的窗口就会触发自动补全,字体和背景颜色理论上应该跟原本的窗口是一致的,右下角三角形是拖动改变大小的。具体的情况如下图:

录制 20241016134045192.gif

原理简述

本质上是用 codemirror 替换了思源编辑窗口的 textarea,然后限定以“\”开头的单词才会触发自动补全(鉴于目前 HTML 代码编辑窗、SQL 代码编辑窗并没有区分,然而前两者并没有需要输入反斜杠的关键词,这样做或许不会产生混淆)

目前没有做任何的语法分析和高亮,并且词库使用的是 MathJax 的词库,和 KaTex 的还不太一样,在使用过程中建议自己逐渐更新词库,直接在 index.js 里面搜 mathSnippetListmathKeywordList 就可以修改,其中前者会根据 apply 字段作为模板生成 snippets,后者的 label 就是补全的结果,而 displayLabel 是显示出来的那个,type 是用来改变图标的,具体参考 codemirror 说明

README 是直接照搬的 sidebar-memo 的,懒得改了,能用就行,就酱!

源码

想了想还是把源码放出来了,在 webpack.config.js 里面修改一下 targetDir(目标文件夹,就是工作空间里插件所在的文件夹),再 pnpm install 以及 pnpm run build 就可以了。源码如下:

siyuanpluginenhanceeditor 源码.zip

  • 思源笔记

    思源笔记是一款隐私优先的个人知识管理系统,支持完全离线使用,同时也支持端到端加密同步。

    融合块、大纲和双向链接,重构你的思维。

    22251 引用 • 88937 回帖
  • 插件
    98 引用 • 575 回帖 • 3 关注
  • LaTeX

    LaTeX(音译“拉泰赫”)是一种基于 ΤΕΧ 的排版系统,由美国计算机学家莱斯利·兰伯特(Leslie Lamport)在 20 世纪 80 年代初期开发,利用这种格式,即使使用者没有排版和程序设计的知识也可以充分发挥由 TeX 所提供的强大功能,能在几天,甚至几小时内生成很多具有书籍质量的印刷品。对于生成复杂表格和数学公式,这一点表现得尤为突出。因此它非常适用于生成高印刷质量的科技和数学类文档。

    12 引用 • 54 回帖 • 71 关注
1 操作
WingDr 在 2024-10-17 15:20:19 更新了该帖

相关帖子

欢迎来到这里!

我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。

注册 关于
请输入回帖内容 ...
  • zxhd86 1 赞同

    其实我很久之前就建议利用 codemirror 替代代码块,还有这个部分了 😋 不过最后还是看到作为插件形式出现了

    1 回复
  • 其他回帖
  • 用过,就是觉得有些我需求的地方不是很方便,包括使用一些环境之类的,最后还得切到最初的源码编辑

  • QMike 1 赞同 1 评论

    下载解压后的文件夹的命名其实有问题,和插件中的设置不同,所以启用不成功
    解决方法:将该插件文件夹改名为 siyuan-plugin-enhance-editor 后,再放入 /data/plugins

    (其实就是删掉文件夹原名称的一些后缀)

    感觉其实后缀是链滴资源文件加的,上传时应该没有的
    EmptyLight 1 赞同
  • 收到,我试着写成真正插件的形式吧,这两天补完然后上架集市,补全的地方我单独提取出来做个文件,主要是之前就想简单用用不想用思源的读取文件接口所以直接写代码里了

    深色模识确实有点问题,我去看看怎么配置一下 codemirror

    1 回复
  • 查看全部回帖