Yank Note 功能全解析：从数据存储到 AI Copilot 的完整能力指南

Yank Note 功能全解析从数据存储到 AI Copilot 的完整能力指南【免费下载链接】ynA highly extensible Markdown editor featuring version control, AI Copilot, document annotations, mind maps, document encryption, executable code snippets, chart embedding, HTML applets, plugins, and macro replacement. Its integrated sidebar terminal makes working with AI faster and more convenient.项目地址: https://gitcode.com/GitHub_Trending/yn/yn导读本文以开源项目 Yank Note本仓库GitHub_Trending/yn/yn官方功能文档 help/FEATURES.md 为主体系统梳理其数据存储、文档加密、Markdown 增强、图表渲染、代码运行、Applet 小程序、AI Copilot、宏替换与命令行参数等核心能力并结合仓库源码与测试用例佐证底层实现。读完本文你将掌握 Yank Note 作为高扩展性 Markdown 编辑器的完整功能矩阵能直接上手配置与使用各项特性并理解其实现原理。一、数据存储与目录结构Yank Note 将应用产生的数据统一存放在当前用户主目录下的yank-note文件夹中。home指当前用户目录各平台示例如下WindowsC:\Users\usernameLinux/home/usernameMac/Users/username点击托盘菜单中的Open Main Dir打开主目录即可查看这些数据。目录说明路径说明home/yank-note/config.json配置文件home/yank-note/pandoc-reference.docx导出 docx 的参考文档home/yank-note/histories文档历史版本home/yank-note/plugins插件home/yank-note/themes主题home/yank-note/extensions扩展home/yank-note/data其他用户数据[!TIP] 如果不小心丢失了文档内容可以检查histories文件夹尝试恢复。[!CAUTION] 出于性能考虑超过 102400 个字符的文档不会存储历史版本。因此在文档中嵌入 Base64 图片时需要格外小心。该阈值在源码 src/share/misc.ts 中定义为DOC_HISTORY_MAX_CONTENT_LENGTH 102400。二、目录生成TOC在文档中写入[toc]{type: ul, level: [1,2,3]}即可生成目录type指定列表类型ul/ollevel指定包含的标题层级。本文档自身即使用[toc]{type: ol, level: [2]}生成目录。三、TODO 状态切换在预览界面中点击 TODO 项即可切换完成状态支持带时间戳的完成记录 [x] ~~2021-06-06 10:27~~ TEST1 [x] ~~2021-06-06 10:27~~ TEST2 [x] ~~2021-06-06 10:27~~ TEST3四、加密文档Yank Note 对机密信息的存储提供了内置加密能力以.c.md结尾的文档被视为加密文档可用于存储机密信息。该约定定义于 src/share/misc.tsENCRYPTED_MARKDOWN_FILE_EXT .c.md并配合isEncryptedMarkdownFile()判断见 src/share/misc.ts。加密与解密过程均在前端完成采用 AES-CBC Pkcs7 填充密钥与 IV 由密码的 MD5 派生密码哈希用于校验见 src/renderer/utils/crypto.ts。务必妥善保管加密文档的密码一旦丢失只能暴力破解。从源码看src/renderer/services/document.tsisEncrypted()仅在文档类型为file且路径符合.c.md约定时返回true加密文档默认不启用自动保存autoSave逻辑见 src/renderer/services/document.ts。五、Markdown 增强语法在编辑器中输入/即可获得增强语法的自动补全提示支持以下语法Mark 标记marked上标29^th^下标H~2~0脚注footnote[^1]文末用[^1]: 内容定义Emoji:joy:缩写Abbr通过*[HTML]: Hyper Text Markup Language定义后文中使用HTML即可显示缩写说明Wiki 链接支持[[filename#anchor|display text]]或[[filename:line,column|display text]]语法例如[[README#Highlights|Features]]、[[README:3,4]]标签#Markdown #Help六、GitHub 风格 AlertsYank Note 基于markdown-it-github-alerts实现了 GitHub 风格的提示块[!NOTE] Note Highlights information that users should take into account, even when skimming.[!TIP] Optional information to help a user be more successful.[!IMPORTANT] Crucial information necessary for users to succeed.[!WARNING] Critical content demanding immediate user attention due to potential risks.[!CAUTION] Negative potential consequences of an action.七、元素属性Element Attribute基于markdown-it-attributes实现可对任意元素追加类名与内联样式- Red Text, white background, border, align text center {.bgw .text-center .with-border stylecolor:red} - Display As **Block Element**{.block} - Escape\{stylecolor:red}内置样式类见 help/FEATURES.md 表格类名说明avoid-page-break打印/导出 PDF 时避免在元素内部换页new-page打印/导出 PDF 时在元素前分页skip-print打印/导出 PDF 时跳过该元素skip-export导出/复制 HTML 时跳过该元素inline以行内元素显示block以块级元素显示reduce-brightness深色主题下降低元素亮度bgw设置元素背景为白色copy-inner-text标记“Ctrl/Cmd 左键单击”复制元素文本wrap-code应用于代码块使其自动换行text-left/text-center/text-right元素文本对齐with-border为元素添加边框八、图片增强块级居中与行内显示如果段落中只有一个图片元素默认渲染为块级元素并居中若想显示为行内元素可在图片链接参数后追加.inline如上面的示例。白色背景为透明图片添加白底以优化显示可追加.bgw如。设置尺寸基于markdown-it-imsize设置图片宽高例如宽度 16px 的图片。九、思维导图Mind Map只需在列表根节点末尾添加{.mindmap}即可将列表渲染为思维导图 Central node{.mindmap} [1] State Visibility [2] Environmental Appropriate [3] User Controllable [4] Consistency [5] Error Proofing [6] Accessibility [7] Agility and Efficiency [8] Grace and Simplicity [9] Fault Tolerance [10] Friendly Help思维导图基于 kityminder-core其渲染逻辑在解析列表 token 后检查是否携带mindmap类测试见 src/renderer/plugins/tests/markdown-mind-map.ts同时支持导出 PNG、SVG 与.km文件。十、Mermaid 图表Yank Note 内置 Mermaid 图表渲染支持流程图、时序图、甘特图、状态图、饼图、旅程图等类型十一、PlantUML在设置中plantuml-api面板可配置使用本地端点或 PlantUML 在线端点来生成图形。[!IMPORTANT] 如果使用本地端点系统需要安装带 Graphviz 的 Java 环境。若提示错误Cannot find Graphviz请参考 GraphViz 安装测试文档。示例startuml a - b enduml实现细节可参考 src/renderer/plugins/markdown-plantuml.ts其测试用例覆盖了startmindmap、startuml等多种起始标记。十二、表格增强基于markdown-it-multimd-table实现支持在表格中使用多行文本和列表并支持表格描述caption渲染。支持通过双击或右键单元格快速编辑内容快捷键如下快捷键行为DBLClick编辑单元格Escape退出编辑Enter确认编辑并移到下一行Shift Enter确认编辑并移到上一行Cmd/Ctrl Shift Enter确认编辑并在下方插入新行Tab确认编辑并移到下一列Shift Tab确认编辑并移到上一列多行列表与表格描述示例First header | Second header -------------|--------------- List: | More \ - [ ] over | data \ - several | Test | Test [Test Table]对齐与缩放示例{.small}缩小表格First header | Second header :-----------:|:--------------: AAAAAAAAAAAA | BBBBBBBBBBBBBB AAAAAAAAAAAA | BBBBBBBBBBBBBB AAAAAAAAAAAA | BBBBBBBBBBBBBB AAAAAAAAAAAA | BBBBBBBBBBBBBB AAAAAAAAAAAA | BBBBBBBBBBBBBB Test | Test [Small Table] {.small}合并单元格示例支持rowspan/colspan与内联样式| h1 | h2 | h3 | | -- | -- | -- | | x1 | x2 | x3 {rowspan2 stylecolor:red} | | x4 {colspan2} | [Merge Cells]十三、LaTeX 数学公式基于 KaTeX 提供数学公式渲染支持行内公式与块级公式$$ \begin{array}{c} \nabla \times \vec{\mathbf{B}} -\, \frac1c\, \frac{\partial\vec{\mathbf{E}}}{\partial t} \frac{4\pi}{c}\vec{\mathbf{j}} \nabla \cdot \vec{\mathbf{E}} 4 \pi \rho \\ \nabla \times \vec{\mathbf{E}}\, \, \frac1c\, \frac{\partial\vec{\mathbf{B}}}{\partial t} \vec{\mathbf{0}} \\ \nabla \cdot \vec{\mathbf{B}} 0 \end{array} $$行内公式示例$\nabla \cdot \vec{\mathbf{B}} 0$$\vec{\mathbf{B}}$ 的散度为零。KaTeX 选项可通过 Front Matter 的katex字段配置如宏定义。十四、代码运行Code Running支持运行JavaScript、PHP、nodejs、Python、bash、bat代码。该功能通过执行外部命令实现因此需要安装对应运行环境。使用方法代码块第一行需包含字符串--run--。JavaScriptWeb Worker 与主线程JS 代码默认在Web Worker中运行如需在主线程运行可在代码块后追加--no-worker--参数// --run-- await new Promise(r setTimeout(r, 500)) console.log(HELLOWORLD)主线程运行时代码可访问编辑器 APIctx对象// --run-- --no-worker-- await new Promise(r setTimeout(r, 500)) ctx.ui.useToast().show(info, HELLOWORLD!) console.log(HELLOWORLD)如需 HTML 输出追加--output-html--参数// --run-- --output-html-- console.log(output iHTML/i)从源码看src/renderer/plugins/code-runners.tsx运行器解析代码首行通过--no-worker--、--output-html--分别决定使用JavascriptIframeExecutor主线程iframe 隔离还是JavascriptWorkerExecutorWeb Worker 线程Worker 模式下输出经过缓冲与 SharedArrayBuffer 同步机制回传主线程见 src/renderer/plugins/code-runners.tsx。渲染层 src/renderer/plugins/markdown-code-run.ts 在代码块首行包含--run--且未处于安全模式safeMode时注入运行按钮与结果面板。其他语言// --run-- console.log(HELLOWORLD)// --run-- echo HELLOWORLD!;# --run-- print(HELLOWORLD)# --run-- dateREM --run-- echo HELLOWORLD对于需要编译的语言可在--run--后直接书写编译执行命令命令中的$tmpFile为临时文件占位符// --run-- gcc $tmpFile.c -o $tmpFile.out $tmpFile.out #include stdio.h int main () { printf(Hello, World!); return 0; }// --run-- java $tmpFile.java class HelloWorld { public static void main(String[] args) { System.out.println(Hello, World!); } }十五、集成终端Integrated Terminal使用Alt/Option T或点击状态栏Switch terminal菜单调出集成终端在编辑器中选中一段代码按Shift Alt/Option R可直接在终端中运行无需复制粘贴右键目录可将终端工作目录切换为当前目录。十六、HTML Applets 小程序支持在文档中嵌入 HTML 小程序。HTML 代码块第一行需包含字符串--applet--其余字符串作为小程序标题。哈希计算小程序示例!-- --applet-- Hash -- script function run (type) { const input document.getElementById(input) const output document.getElementById(output) output.value switch (type) { case md5: output.value ctx.lib.cryptojs.MD5(input.value).toString().toLowerCase() break case sha1: output.value ctx.lib.cryptojs.SHA1(input.value).toString().toLowerCase() break case sha256: output.value ctx.lib.cryptojs.SHA256(input.value).toString().toLowerCase() break } output.focus() output.select() } /script div Input textarea idinput styledisplay: block; width: 100%/textarea button onclickrun(md5)MD5/button button onclickrun(sha1)SHA1/button button onclickrun(sha256)SHA256/button textarea idoutput styledisplay: block; width: 100%/textarea button onclickdocument.getElementById(input).value ; document.getElementById(output).value Clear/button button onclickvar x document.getElementById(output); x.value x.value.toUpperCase()Uppercase/button /div若标题为空则不显示外层边框装饰!-- --applet-- -- button onclickctx.ui.useToast().show(info, HELLOWORLD!)HELLO/buttonApplet 内可通过ctx访问编辑器上下文与内置库如示例中的ctx.lib.cryptojs。另外还可以安装并激活Vue Repl 扩展yank-note/extension-repl使用 Vue SFC 编写小程序。实现与测试见 src/renderer/plugins/markdown-applet.ts 及 src/renderer/plugins/tests/markdown-applet.ts。十七、ECharts 图表Js 代码块首行包含--echarts--字符串即被解析为 ECharts 图形代码通过chart.setOption(option, true)设置图表配置// --echarts-- const option { title: { text: Customized Pie, left: center, top: 20, textStyle: { color: #888 } }, tooltip : { trigger: item, formatter: {a} br/{b} : {c} ({d}%) }, visualMap: { show: false, min: 80, max: 600, inRange: { colorLightness: [0, 1] } }, series : [ { name:referer, type:pie, radius : 55%, center: [50%, 50%], data:[ {value:335, name:Direct visit}, {value:310, name:Email marketing}, {value:274, name:Affiliate advertising}, {value:235, name:Video advertisement}, {value:400, name:Search engine} ].sort(function (a, b) { return a.value - b.value; }), roseType: radius, label: { normal: { textStyle: { color: #888 } } }, labelLine: { normal: { lineStyle: { color: #888 }, smooth: 0.2, length: 10, length2: 20 } }, itemStyle: { normal: { color: #c23531, shadowBlur: 200, shadowColor: rgba(0, 0, 0, 0.5) } }, animationType: scale, animationEasing: elasticOut, animationDelay: function (idx) { return Math.random() * 200; } } ] } chart.setOption(option, true)ECharts 渲染由 src/renderer/plugins/markdown-echarts.ts 实现测试用例src/renderer/plugins/tests/small-zero-plugins.ts验证了首行含--echarts--时触发渲染、缺少setOption配置时返回空渲染。十八、Draw.io 文件嵌入链接属性的link-type值设为drawio字符串即可嵌入 drawio 图形文件使用该链接格式不会影响其他 Markdown 解析器的解析[drawio](https://link.gitcode.com/i/7370ffbc67b636980a64a0365b47d317){link-typedrawio}十九、Container Block 容器块支持类似 VuePress Container Block。语法::: type [title] [content] :::type必填title与content可选。支持的type有tip、warning、danger、details、code-group、group、group-item、row、col、section、div。示例::: tip This is a prompt ::: ::: warning This is a warning ::: ::: danger This is a danger warning ::: ::: danger STOP Dangerous area, no pass ::: ::: details This is a details label ::: ::: details click to expand more This is a details label :::标签组group/group-item标题以*开头表示默认激活的标签页:::: group This is label group ::: group-item Tab 1 test 1 ::: ::: group-item *Tab 2 test 2 Title starts with * mean that this tab is activated by default ::: ::: group-item Tab 3 test 3 ::: ::::代码组code-group代码块标题用[文件名]指定::: code-group js [test.js] let a 1let a: number 1:::**行列布局**row / col 组合实现多列 md ::::: row Columns :::: col TODO ::: warning Item 1 ::: ::: warning Item 2 ::: ::: warning Item 3 ::: :::: :::: col DONE ::: tip Item 4 ::: ::: tip Item 5 ::: :::: ::::: :::: row ::: col Column 1 test 1 ::: ::: col Column 2 test 2 ::: ::: col Column 3 test 3 ::: ::::二十、AI CopilotYank Note 集成 OpenAI、Google AI 等人工智能平台提供智能补全与文本重写等能力。[!NOTE] 需要自行获取相关 API Token并要求AI Copilot 扩展yank-note/extension-openai已安装并启用。二十一、Front Matter 配置页面支持类似 Jekyll Front Matter。内置变量如下变量名类型说明headingNumberboolean是否启用页面标题序号导出 HTML 时对应ul classheading-number见 src/renderer/services/export.tswrapCodeboolean是否启用代码换行enableMacroboolean是否启用宏替换tagsstring[]文档标签defineRecordstring, string宏定义字符串替换defaultPreviewerstring文档默认预览器某些扩展提供特殊预览界面如 Reveal.js 扩展mdOptionsRecordstring, booleanmarkdown-it 解析选项mdOptions.htmlboolean在源码中启用 HTML 标签mdOptions.breaksboolean将段落中的\n转换为brmdOptions.linkifyboolean自动将 URL 样文本转换为链接mdOptions.typographerboolean启用部分语言中立的替换与引号美化katexRecordstring, anyKaTeX 选项如宏定义二十二、宏替换Macro Replacement[!NOTE] 该功能仅在Premium高级版可用。测试用例 src/renderer/plugins/tests/markdown-macro.ts 验证了未购买时渲染“需要购买”占位提示。[!IMPORTANT] 使用前需在 Front Matter 中启用enableMacro: true。[!WARNING] 使用宏替换可能导致源码与预览的行号对应不准确Yank Note 已尽可能处理但某些场景仍可能造成同步滚动异常。定义definedefine字段可定义文本替换映射支持在另一个文件中定义也支持宏表达式。宏表达式支持异步await/Promise。还可在设置中定义全局宏macros面板但仍需在 Front Matter 中设置enableMacro: true。全局宏在 src/renderer/plugins/markdown-macro.ts 中与文档define合并。本文档顶部 Front Matter 即是一个示例--- headingNumber: true enableMacro: true customVar: Hello define: --APP_NAME--: Yank Note --APP_VERSION--: [ $ctx.version ] ---宏表达式语法[ expression ]expression为需要执行的 JS 表达式支持await/Promise 异步表达式。若表达式本身需要包含[或]请用[\或\]转义。从源码看src/renderer/plugins/markdown-macro.ts表达式通过new Function(vars, with (vars) { return (exp); })构造执行await开头的表达式使用AsyncFunction结果以__macroResult包装返回异步结果带缓存以表达式 MD5 为键并在完成后自动重渲染。示例获取 Front Matter 布尔变量[ headingNumber ]使用自定义变量[ customVar ]导出并使用变量[ $export(testVar, Test) ][ testVar ]导出并使用函数[ $export(format, (a, b) ${a}, ${b}!) ][ format(HELLO, WORLD) ]进一步处理替换结果[ $afterMacro(src src.replace(/X{4,}/g, YYYYY)) ]应用版本号[ $ctx.version ]当前文档名不含后缀[ $doc.basename ]当前时间[ $ctx.lib.dayjs().format(YYYY-MM-DD HH:mm) ]序号生成[ $seqFigure-] | [ $seqFigure-] | [ $seqFigure-] | [ $seqTable-]转义示例[ [\ \] ]算术[ (1 2) / 2 ]引用其他文件片段支持 3 层嵌套可使用目标文档中定义的 Front Matter 变量[ $include(./help/_FRAGMENT.md, true) ]引用文档中定义的变量[ customVarFromOtherDoc ]你的 IP 地址[ fetch(https://ifconfig.me/ip).then(r r.text()) ]天气查询异步 延时[ await ctx.utils.sleep(1000), fetch(https://wttr.in?0AT).then(r r.text()) ]九九乘法表多行表达式[ (function nine (num) { let res for (let i 1; i num; i) { let str ; for (let k 1; k num; k) { if (i k) { str k x i i*k ; } } res res str \n } return res })(9) ]内置变量宏表达式可以使用 Front Matter 中定义的变量也可使用以下内置变量变量名类型说明$ctxobject编辑器ctx上下文参见 插件开发指南$include(path: string, trim false) Result引入其他文档片段的方法$export(key: string, val: any) Result定义可在本文档中使用的变量$afterMacro(fn: (src: string) string) Result定义宏替换后的回调函数可对替换后的文本进一步处理$noop() Result无操作用于占位保留文本空间$docobject当前文档信息$seq(label: string) Result序号生成器$doc.basenamestring当前文档文件名不含后缀$doc.namestring当前文档文件名$doc.pathstring当前文档路径$doc.repostring当前文档所在仓库$doc.contentstring当前文档内容$doc.statusloaded \| save-failed \| saved当前文档状态二十三、命令行参数向他人交付文档时可通过脚本或自定义命令行参数启动应用方便对方直接查看。参数由 src/main/app.ts 与 src/main/constant.ts 解析data-dir直接决定用户数据目录disable-tray控制托盘启用与否名称用途默认值描述示例--port服务器监听端口3044端口--port8080--disable-tray禁用常驻托盘falsetrue/false--disable-tray--readonly编辑器只读falsetrue/false--readonly--show-status-bar显示状态栏truetrue/false--show-status-barfalse--data-dir数据目录无目录路径字符串--data-dir./.data--init-repo初始仓库名称无字符串--init-repotest--init-file加载文件路径无文件路径相对于仓库路径--init-file/1.mdURL 测试用例src/main/tests/url.ts验证了这些参数如何拼入启动 URL如readonlytrueshow-status-barfalseinit-repomainport3044。二十四、自定义样式Custom Styles右键托盘图标点击Open Main Dir进入themes文件夹将github.css复制为新的 CSS 文件并修改打开设置 → 外观Appearance→ 自定义 CSS切换 CSS 文件。二十五、CLI 与 MCPYank Note 支持 CLI命令行接口与 MCPModel Context Protocol允许以编程方式与应用交互。MCP 服务端实现在 src/renderer/plugins/mcp-server.ts含导出工具 src/renderer/plugins/mcp-export.ts进程侧分发逻辑见 src/main/proxy-dispatcher.ts。二十六、插件开发插件体系是 Yank Note 扩展能力的核心渲染层通过 src/renderer/core/plugin.ts 管理插件注册与生命周期ctx上下文由 src/renderer/context/index.ts 提供扩展管理器 UI 见 src/renderer/components/ExtensionManager.vue。具体开发方法请参阅 插件开发指南。【免费下载链接】ynA highly extensible Markdown editor featuring version control, AI Copilot, document annotations, mind maps, document encryption, executable code snippets, chart embedding, HTML applets, plugins, and macro replacement. Its integrated sidebar terminal makes working with AI faster and more convenient.项目地址: https://gitcode.com/GitHub_Trending/yn/yn创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考