夜雨聆风
研究生摸鱼实录:我用AI编程在Edge插件市场从零开发了一个公式转换器
大家好，我是「海绵朋克」一位痴迷于AI前沿的在读研究生👨🎓。我希望通过公开表达分享自己在AI领域的实践与思考。
这是我的第一篇文章，我想分享一个自己最近完全利用AI编程从0开发，并成功发布在Edge浏览器的公式转换插件——📚LLM LaTeX to MathType的开发过程。如果你也对Vibe Coding感兴趣，希望我的经验会对你有所帮助。
一、项目背景——摸鱼时间的“副业”
作为一名理工科的研究生，AI工具已经成为我日常研究过程中的得力助手，会经常利用AI生成数学公式📖。
但如果你也经常使用AI就会发现，目前的AI普遍在显示界面会生成工整的数学公式，但复制后粘贴出来的结果往往是一堆乱码，仍然需要人工手动输入word中。
而一些规范性文本需要使用mathtype输入公式，这就进一步增加了使用AI模型生成数学公式的人工成本，并没有从中体验到AI工具的便捷。
在此之前，我从同门那里被安利了SimpleTex用截屏的方式识别公式，工作效率大大提升！但是….
普通用户要排队等名额….😭
作为贫穷的研究牲，本着能白嫖就不花钱的目的，就想既然AI编程这么发达，为什么不自己搓一个？更何况Simple Tex基于图像识别的公式格式转换效率并不高，为什么不能直接做一个“复制-粘贴”格式的呢？
说干就干，于是本着刷手机也是摸鱼，vibe coding也是摸鱼，我就开始了用AI 编程，给自己手搓一个 Microsoft Edge 侧边栏扩展，作为 AI 与 Word 之间的“翻译官”。
二、工具使用
📚AI工具：gemini （花了点小钱弄到了学生认证，美美使用一年的gemini pro）
📖编程语言：javascrip+html+css （本人仅仅知道这三件套是开发网站常用的编程语言，但完全不懂里面的语法）
📊编程IDE：Trae(国际版) （字节跳动开发的基于开源VS Code内置AI模型的编辑器，但实际开发过程中没有用到IDE内部的AI写代码，仅用其进行了语法检测）
三、产品设计
尽管开发过程完全借助AI工具，但明确产品定位和需求才是关键，这两点依赖开发者的主观能动性，AI在其中并不能发挥太多实质性的作用。
所以该产品的设计完全取决于我自己的审美与诉求，具体内容如下：
·网页端侧边栏工具💻
·因为日常使用的AI工具多是网页端，使用网页端侧边栏工具使用起来更方便
·可以直接制作成浏览器「插件」，随时随地都能从浏览器插件市场下载
·“复制-粘贴”形式转换公式
·尽管仍然需要人工操作，但能大幅度提高效率
·支持批量文本输入，批量公式导出📒
·单一公式的处理并不耗费人力，长公式、多公式才是浪费人力成本的核心
·公式可以以MathML格式和Word文本格式两种格式输出
·MathML就是规范的数学公式形式，Word文本格式是为了便于快速生成演示文稿
·本地化、轻量化🏠
·考虑到用户隐私安全和包体大小，本地化的轻量化软件用起来才放心
在浏器插件市场的选择上，我只选择了Edge浏览器，理由是注册Microsoft开发者账号「免费」！在chrome上注册开发者需要支付「5美金」！因为我没有支付渠道，所以只能选择还算常用的Edge浏览器了。
（不过Edge和chrome浏览器的内核是互通的，所以如果拥有工具的「本地包体」，是可以直接在chrome浏览器打开「开发者模式」，导入使用的。）
四、技术细节
首先我将给大家简单展示一下我的输入「提示词」是怎么设计的。
我觉得有必要解答大部分人的一个误区，就是不要太专注于怎么设计「提示词」，提示词的作用只是为了对齐「人脑」和「AI」之间的认知差距，只要我们能把事情说清楚就行，没有必要花精力刻意去学习各种提示词。
我的「提示词」设计分成三个结构：
认知对齐——指令执行——结果优化
·认知对齐
认知对齐是先和AI对话一遍，说明自己的需求，并要求AI复述并理解一下我的需求，这一步需要我们核对一遍AI的理解，如果有问题需要进行纠正，如果没问题就可以执行了。
·指令执行
AI执行过程中会生成详细的代码，对于网页端的工具来说，往往会生成多个代码，这些代码需要放到不同的「文件」下。
代码可能不会一次性就输出所有的代码，请注意AI生成的对话结尾是否完整生成了所有代码，如果没有全部生成，让它继续生成就好。
生成好的代码需要按照「文件类型」放到不同的文件下保存，这里我使用了Trae作为编程的IDE管理代码，如果你没有编程经验，老实说，你可能并不能理解我在干什么。
这一步其实还是需要有一定的编程经验的，完全0基础编程是不现实的，不过如果你能花些精力简单学习一下什么是「编程IDE」，什么是「存放代码的文件」，以及代码文件之间的「关联关系」，你就可以上手了，这篇文章就不做过多介绍了。
·结果优化
结果优化的部分就是运行代码，验证所达到的效果是不是符合我们的需求。
对于浏览器插件，可以直接在浏览器「插件」中打开「开发者选项」会出现一个「导入未打包扩展插件」，点击并选择代码中的所有文件就可以将开发的「插件」在浏览器中运行，并检验了。
由于代码很简单，所以检验的步骤就完全人工进行了，如果过程中发现问题，就是把「报错日志」发送给gemini，不断的对话修正，直到解决所有的问题。
以下是部分对话演示：（该图片可左右滑动）
这个工具的开发并非一蹴而就，而是经历了两个主要版本的迭代，分别解决了不同阶段的问题。
v1.0 版本：Gemini 专用版
定位：MVP（最小可行性产品）。
功能：专注于处理标准的 LaTeX 格式（即包裹在 $ $…$ $ 或 \(…\) 中的内容）。
兼容性：这个版本可以说是“Gemini 专供”。因为 Google Gemini 的输出非常规范，复制出来的就是标准的 LaTeX 源码，处理起来非常顺畅，转换准确率接近 100%。
v1.1 版本：全网兼容挑战版（当前版本）
定位： 解决复杂脏数据的进阶版。
背景： 当我试图兼容 ChatGPT、DeepSeek 等其他模型时，发现情况非常糟糕。这些模型在网页端的复制机制导致剪贴板中充满了“视觉字符”（Unicode）、“隐形字符”（零宽空格）和断裂的文本。
核心升级：
Unicode 逆向翻译：将μ、θ、≤等字符强制转回LaTeX 源码。
碎片重组算法：修复因换行导致的公式断裂（如L( \n ϕ）。
RL领域增强：针对强化学习公式进行了专门优化（如自动识别 \mathbb{E} 期望符号）。
智能去重：解决了MathJax复制时常见的“双重显示”乱码问题。
本项目中有些功能的代码靠AI是没法完全解决的，因为这些代码相当复杂，远远超出了输出token的极限，因此这个工具中最关键的「格式转换」核心依赖于轻量级的 LaTeX 转换库 Temml。（这也说明AI仍然无法完全取代传统程序员，大项目的开发仍然更加依赖人工来设计完整思路和编写复杂代码）
Temml.js 核心库下载地址：https://github.com/ronkok/Temml(建议在 Releases 中下载 temml.min.js, temml.css 以及对应的字体文件)
五、 成果展示
latex文本格式：
$ $\nabla_{\theta_i} J(\mu_i) = \mathbb{E}_{x, a \sim \mathcal{D}} \left[ \nabla_{\theta_i} \mu_i(a_i | o_i) \cdot \nabla_{a_i} Q_i^\mu(x, a_1, \dots, a_i, \dots, a_N) \big|_{a_i = \mu_i(o_i)} \right]$ $
word文本格式：
∇θiJ(μi)=𝔼x,a∼𝒟[∇θiμi(ai|oi)⋅∇aiQiμ(x,a1,…,ai,…,aN)|ai=μi(oi)]
标准数学公式：
同时，还支持批量的文本输入，能够自动识别其中的公式，且把至多50个公式的MathML格式列出来。
六、 行业观察与呼吁
在开发 v1.1 版本的过程中，我深刻体会到了目前 AI 领域在“富文本/公式复制体验”上的巨大割裂感。
现状： 每家 AI 厂商对公式复制后的剪贴板格式设计都不一样。
有的给 Unicode 混排（导致 Word 无法识别，且难以通过代码还原）。
有的虽然给 LaTeX，但夹杂了大量 HTML 标签或零宽空格。
Gemini 的优势： 在众多模型中，Google Gemini 的表现最为规范。它输出的公式格式纯净、标准，对开发者和用户都极其友好。
呼吁： 我在此呼吁各大 AI 厂商（OpenAI, DeepSeek, Claude 等）能向 Gemini 靠拢，规范剪贴板输出格式。标准化的 LaTeX 输出不仅能降低开发者的工具适配难度，更能极大提升科研人员的使用效率。不要让格式壁垒成为知识传播的障碍！
七、 给用户的诚恳建议
虽然我倾注心血开发了这个工具，但我必须诚实地根据实际体验给出建议：
如果你是 Gemini 用户： 我十分推荐你体验一下这个插件！它与 Gemini 的契合度是 100%，你只需要简单的“复制-粘贴”，就能获得完美的 MathType 公式，无需任何额外操作。
如果你是其他 AI 用户（ChatGPT/DeepSeek 等）： 尽管 v1.1 版本已尽力修复乱码，但网页端的格式有时极为破碎。在这种情况下，我更推荐你使用基于图像识别的软件，比如 SimpleTex。直接截图识别往往比文本修复更“暴力有效”。顺便一提，SimpleTex 学生认证后会员费还能打折，对于处理顽固公式来说，它是除了本插件之外的另一个绝佳选择。
结语：
这个工具的诞生，不仅仅是为了省去几次敲击键盘的时间，更是为了让科研人员从繁琐的格式调整中解放出来。希望LLM LaTeX to MathType能帮助大家搞定那些顽固的乱码公式！
下载链接：
https://microsoftedge.microsoft.com/addons/detail/llm-latex-to-mathtype/popnakegfacflbndoiecconmbnhnohfn?hl=zh-CN
