尧图网站设计 尧图网站设计YAOTU DESIGN
ARTICLE DETAIL

资讯详情

深耕网站设计与一线实操的经验洞察。

【开源推荐】别再破解 Typora 了!这款开源 Markdown 神器接入 AI,体验拉满!

【开源推荐】别再破解 Typora 了!这款开源 Markdown 神器接入 AI,体验拉满! 从零使用 VS2026 / .NET 8 打造一款现代化 VS Code 风格的 AI Markdown 写作与阅读器一、 技术选型UI 框架WPF (.NET 8.0-windows)核心渲染Microsoft.Web.WebView2基于 Chromium 内核完美支持现代 CSS、JS 与富文本渲染Markdown 解析Markdig高性能 CommonMark 与 GFM 扩展库图表与公式Mermaid.jsKaTeX(通过 CDN 动态注入 WebView2)二、 核心代码实现1. 项目工程文件 (SmartMarkDown.csproj)确保配置了-windows目标框架与 WPF 支持ProjectSdkMicrosoft.NET.SdkPropertyGroupOutputTypeWinExe/OutputTypeTargetFrameworknet8.0-windows/TargetFrameworkNullableenable/NullableImplicitUsingsenable/ImplicitUsingsUseWPFtrue/UseWPF/PropertyGroupItemGroupPackageReferenceIncludeMarkdigVersion0.37.0/PackageReferenceIncludeMicrosoft.Web.WebView2Version1.0.2592.51//ItemGroup/Project2. 多 AI 模型调度引擎 (AiService.cs)支持在 DeepSeek、OpenAI 与本地 Ollama 之间无缝切换usingSystem;usingSystem.Collections.Generic;usingSystem.Net.Http;usingSystem.Net.Http.Headers;usingSystem.Text;usingSystem.Text.Json;usingSystem.Text.Json.Nodes;usingSystem.Threading.Tasks;namespaceSmartMarkDown{publicclassAiProvider{publicstringName{get;set;}string.Empty;publicstringEndpoint{get;set;}string.Empty;publicstringModelId{get;set;}string.Empty;publicstringApiKey{get;set;}string.Empty;publicboolRequiresKey{get;set;}true;}publicclassAiService{privatestaticreadonlyHttpClient_httpnewHttpClient{TimeoutTimeSpan.FromSeconds(60)};publicListAiProviderProviders{get;}newListAiProvider{newAiProvider{NameDeepSeek Chat,Endpointhttps://api.deepseek.com/v1/chat/completions,ModelIddeepseek-chat,ApiKey},newAiProvider{NameDeepSeek Reasoner,Endpointhttps://api.deepseek.com/v1/chat/completions,ModelIddeepseek-reasoner,ApiKey},newAiProvider{NameOpenAI GPT-4o Mini,Endpointhttps://api.openai.com/v1/chat/completions,ModelIdgpt-4o-mini,ApiKey},newAiProvider{NameOllama (本地模型),Endpointhttp://localhost:11434/v1/chat/completions,ModelIdqwen2.5:latest,ApiKeyollama,RequiresKeyfalse}};publicAiProviderCurrentProvider{get;set;}publicAiService()CurrentProviderProviders[0];publicasyncTaskstringProcessAsync(stringsystemPrompt,stringuserContent){if(CurrentProvidernull)thrownewInvalidOperationException(未选择任何 AI 模型。);if(CurrentProvider.RequiresKeystring.IsNullOrWhiteSpace(CurrentProvider.ApiKey))thrownewInvalidOperationException($请先为 [{CurrentProvider.Name}] 配置有效的 API Key);varpayloadnew{modelCurrentProvider.ModelId,messagesnew[]{new{rolesystem,contentsystemPrompt},new{roleuser,contentuserContent}},temperature0.6};varrequestnewHttpRequestMessage(HttpMethod.Post,CurrentProvider.Endpoint);if(!string.IsNullOrWhiteSpace(CurrentProvider.ApiKey))request.Headers.AuthorizationnewAuthenticationHeaderValue(Bearer,CurrentProvider.ApiKey);request.ContentnewStringContent(JsonSerializer.Serialize(payload),Encoding.UTF8,application/json);varresponseawait_http.SendAsync(request);varjsonawaitresponse.Content.ReadAsStringAsync();if(!response.IsSuccessStatusCode)thrownewException($[{response.StatusCode}]{json});varnodeJsonNode.Parse(json);returnnode?[choices]?[0]?[message]?[content]?.ToString()?.Trim()??AI 未返回有效内容;}}}三、 功能亮点与架构设计WebView2 动态注入富文本环境通过 C# 将 Markdig 解析出的 HTML 片段包裹进标准的 HTML 模板中并动态引入了 GitHub Markdown 样式、KaTeX 数学公式渲染脚本以及 Mermaid 图表解析引擎实现了“所见即所得”的极佳阅读体验。VS Code 风格重构重写了 WPF 原生Menu、MenuItem以及ComboBox的 ControlTemplate彻底解决了传统 WPF 控件在暗黑模式下“白底白字”或出现原生滚动条轨道的痛点。选区智能感知AI 任务调度支持“选区优先”原则——选中部分文字时仅对该段落进行润色或翻译未选中则自动处理全文。四、 总结与源码获取通过 WPF 结合 WebView2我们可以极低成本地开发出媲美原生前端框架的现代桌面端工具。本项目代码结构清晰非常适合作为 .NET 桌面开发的练手项目或日常主力 Markdown 写作工具。
返回列表