湖北
這是蒼何的第 448 篇原創(chuàng)！
大家好，我是愛折騰 Obsidian 的b蒼何。
最近實在是閑的蛋疼，各種折騰 Obsidian，配合 CLI，感覺能玩的地方太多了。
這不，又花了點時間，用 Claude Code 開發(fā)了個 Obsidian 插件，姑且叫內(nèi)容分發(fā)助手。
它能夠?qū)⑽以?Obsidian 中寫的公眾號長文，一鍵轉(zhuǎn)成符合各個平臺風(fēng)格的文章。
比如轉(zhuǎn)成小紅書文案：
甚至是標(biāo)簽都能自動生成，點擊一鍵復(fù)制，就可以直接去小紅書后臺發(fā)送了。
還有即刻風(fēng)格的：
還有 X 風(fēng)格，這對于 X 做海外賬號來說，別提多有用，省去了轉(zhuǎn)換到翻譯的過程。（當(dāng)然翻譯與否也是可以選擇的）
在整體設(shè)置上，插件支持進行大模型配置和平臺配置，甚至我還把提示詞也做了配置，你可以用默認提示詞也可以根據(jù)習(xí)慣自行更改。
目前支持的平臺有這些：
支持的模型有這些：
當(dāng)點擊獲取 api key 的時候能自動跳轉(zhuǎn)到對應(yīng)的開放平臺獲取 key。
點擊測試連接的時候，會對 API 進行驗證。
以上就是整個 MVP 版本內(nèi)容分發(fā)助手插件的全部功能。
我已經(jīng)用這個插件跑了幾天了，目前測下來，效果相當(dāng)驚人。
小紅書上也是表現(xiàn)不錯：
相當(dāng)做到了一魚多吃，對于公眾號長圖文創(chuàng)作來說，可以說是法寶了，至少我目前感覺給我提效不少。
如果你對這個插件感興趣，也可以點贊留言告訴我，人多我就考慮給它發(fā)布出來。
但你想象不到，整個開發(fā)我全程用的居然是字節(jié)新出的 Doubao-Seed-Code 做的，因為我在上周就已經(jīng)拿到火山新模型的測試資格。
他們正式官宣是雙十一這天, 還搞了個 9.9 的活動，有點意思。
這個信息圖也是用 Doubao-Seed-Code 做的：
除了模型選擇外，我開發(fā)的環(huán)境也相當(dāng)?shù)钠孑?，用?Obsidian 來開發(fā) ob 插件，可以說整個地球上就湊不齊多少人。（瞎幾把吹牛）
有幾點 Obsidian 插件開發(fā)的經(jīng)驗特別想和你分享，當(dāng)然了，按照慣例，我也會手把手帶著大家來一次用 CC 進行 Obsidian 插件的開發(fā)。
這也會導(dǎo)致這篇文章的內(nèi)容又會顯得巨長，如果你沒耐心看完，可以先點個贊收藏慢慢看。
整篇文章結(jié)構(gòu)大概是這樣的：
介紹一下用到的工具
先從模型開始，這次選的 Doubao-Seed-Code 主要也是為了測試其在實際應(yīng)用開發(fā)中的能力，我發(fā)現(xiàn)單純的用單個 demo 來驗證能力，大家很多也看麻了，還是得在應(yīng)用中來體現(xiàn)。
如你所料，Doubao-Seed-Code 出世也是直接在 SWE-Bench-Verified 中刷新 SOTA。
也是，現(xiàn)在大模型發(fā)布問世，不刷新 SOTA 那還玩?zhèn)€ der。
實際測下來的感受是：能干事，挺便宜。
還有比較亮眼的點是，Doubao-Seed-Code 是支持多模態(tài)能力的，它可參照 UI 設(shè)計稿、截圖或手繪草圖生成代碼，或?qū)ι身撁孢M行視覺比對，自主完成樣式修復(fù)和 Bug 修復(fù)。
比如我第一輪出來的 UI 效果有些抽象，我直接手繪了一個草圖，它先識別圖片內(nèi)容，然后再轉(zhuǎn)為 UI 設(shè)計樣式。
這個能力，據(jù)我所知，還是國內(nèi)第一家支持視覺理解能力的編碼模型。
雙十一，他們也在做活動，9.9 一個月，我把活動地址放在最后了，想要沖的可以點文末閱讀原文去沖，畢竟雙十一就這一次。
好，關(guān)于模型，就先介紹到這，更多信息，可以去火山官網(wǎng)做了解。
然后再一次介紹下 Obsidian，這是一個本地的開源的筆記創(chuàng)作軟件，其插件生態(tài)非常繁榮，自由度非常高，而且非常安全，在上面的所有文檔均是大模型最愛的 markdown 格式的。
Claude Code 就不用多介紹了，很多朋友早玩的很 6 了。
那如何把這三個工具完美融合呢？
首先是把 Claude Code 安裝到 Obsidian 就很簡單，下載個 Terminal 插件一配就好，之前的文章也講過啦，不會的可以去看看。
最后就是把 Doubao-Seed-Code 配置到 Claude Code ，輸入這個配置就好：
export ANTHROPIC_BASE_URL=https://ark.cn-beijing.volces.com/api/compatible export ANTHROPIC_AUTH_TOKEN=你的key export ANTHROPIC_MODEL=doubao-seed-code-preview-latest key 的獲取就在火山后臺：
一、熟悉下插件開發(fā)整體流程
新建一個新的倉庫用來測試。（防止亂搞）
保存到指定文件夾：
先下載個插件模板吧：
第一步，下載示例插件
下載模板：https://github.com/obsidianmd/obsidian-sample-plugin 
點擊 Use this template。
在 Repository name 選項中, 輸入您的插件名稱。 Obsidian 的插件名稱往往以 obsidian- 開頭。 舉個 , obsidian-instant-coffee。
點擊 Create repository from template。
我的名字就叫做：obsidian-content-remix
創(chuàng)建 GitHub 倉庫：
將 GitHub 代碼下載到指定文件夾：
cd path/to/vault/.obsidian/plugins git clone https://github.com/your-username/obsidian-instant-coffee.git 第二步，構(gòu)建插件
跳轉(zhuǎn)對應(yīng)文件夾，并安裝依賴：
# 進入目錄cd path/to/vault/.obsidian/plugins/obsidian-instant-coffee # 安裝依賴 npm install # 編譯插件代碼 npm run dev 第三步，啟用插件
這時候重啟 obsidian，打開倉庫-設(shè)置-第三方插件，就可以看到了。點擊啟用。
第四步，修改插件配置
manifest.json 的修改如下：
package.json 的修改如下：
第五步，修改源碼：
比如修改這段
點擊左側(cè)插件，就會蹦出剛才的提示信息。
需求定義及 claude. md 編寫
在 obsidian 中配置 cc 后的效果是這樣的：
為了讓 AI 更好的工作，我習(xí)慣會在項目的 claude. md 中寫上相關(guān)規(guī)范和要求。
claude. md 文檔定義我也直接貼出來了：
# Role: Obsidian插件開發(fā)專家
## Profile
- language: 中文
- description: 專業(yè)的Obsidian插件開發(fā)專家，專注于內(nèi)容分發(fā)助手插件的設(shè)計與實現(xiàn)
- background: 擁有豐富的Obsidian插件開發(fā)經(jīng)驗，熟悉TypeScript、Node.js和Obsidian API
- personality: 嚴謹細致，注重用戶體驗，善于解決技術(shù)難題
- expertise: Obsidian插件架構(gòu)設(shè)計、UI組件開發(fā)、API集成、內(nèi)容轉(zhuǎn)換算法
- target_audience: Obsidian用戶、內(nèi)容創(chuàng)作者、技術(shù)開發(fā)者
## Skills
1. 核心開發(fā)技能
- TypeScript編程: 精通TypeScript語言特性及Obsidian插件開發(fā)規(guī)范
- UI組件設(shè)計: 熟練使用Obsidian的UI組件庫構(gòu)建用戶界面
- API集成: 能夠集成各種大模型API實現(xiàn)內(nèi)容轉(zhuǎn)換功能
- 配置管理: 實現(xiàn)靈活的平臺配置和Prompt模板管理
2. 輔助開發(fā)技能
- 文檔解析: 解析Obsidian筆記的Markdown格式和元數(shù)據(jù)
- 錯誤處理: 完善的錯誤處理機制和用戶反饋系統(tǒng)
- 性能優(yōu)化: 確保插件運行流暢，不影響Obsidian主程序性能
- 測試調(diào)試: 全面的單元測試和集成測試方案
## Rules
1. 開發(fā)原則：
- 代碼規(guī)范: 嚴格遵循Obsidian官方開發(fā)規(guī)范和TypeScript最佳實踐
- 模塊化設(shè)計: 采用模塊化架構(gòu)，確保代碼可維護性和可擴展性
- 用戶體驗: 界面簡潔直觀，操作流程順暢，反饋及時明確
- 兼容性: 確保插件兼容主流Obsidian版本和操作系統(tǒng)
2. 行為準(zhǔn)則：
- 安全第一: 妥善處理用戶數(shù)據(jù)和API密鑰，不泄露隱私信息
- 穩(wěn)定可靠: 確保插件在各種使用場景下都能穩(wěn)定運行
- 持續(xù)改進: 根據(jù)用戶反饋不斷優(yōu)化功能和性能
- 文檔完善: 提供清晰的使用說明和技術(shù)文檔
3. 限制條件：
- 資源限制: 合理使用系統(tǒng)資源，避免影響Obsidian性能
- API限制: 遵守各平臺API的使用條款和頻率限制
- 功能邊界: 專注于內(nèi)容分發(fā)功能，不涉及無關(guān)特性
- 法律合規(guī): 確保內(nèi)容轉(zhuǎn)換符合版權(quán)和平臺規(guī)定
## Workflows
- 目標(biāo): 開發(fā)功能完整的Obsidian內(nèi)容分發(fā)助手插件
- 步驟 1: 分析需求，設(shè)計插件架構(gòu)和UI界面布局
- 步驟 2: 實現(xiàn)核心功能模塊：筆記解析、平臺配置、大模型集成
- 步驟 3: 開發(fā)用戶界面：平臺選擇、內(nèi)容預(yù)覽、一鍵復(fù)制功能
- 步驟 4: 集成測試和性能優(yōu)化，確保插件穩(wěn)定可靠
- 預(yù)期結(jié)果: 用戶能夠在Obsidian中輕松將筆記轉(zhuǎn)換為各平臺風(fēng)格的文案## Initialization
作為Obsidian插件開發(fā)專家，你必須遵守上述Rules，按照Workflows執(zhí)行任務(wù)。
插件開發(fā)
因為事先定義好了 claude. md，這里 Chat 的提示詞就可以簡單一些，我們把背景和要求都寫好了。
提示詞：我想開發(fā)個內(nèi)容分發(fā)助手的obsidian插件，請根據(jù)相關(guān)需求幫我開發(fā)。 沒幾分鐘，就出來一個版本，我們打開他發(fā)現(xiàn)有了。
但并不是我要的效果，他是個彈窗。
我希望是在側(cè)邊欄能打開，于是我簡單畫了個草圖，讓它按照我的草圖來設(shè)計 UI。
先問問豆包是否能識別到我的草圖。
他說能
于是我才大膽的截圖直接發(fā)給他。
提示詞: OK,這個obsidian內(nèi)容分發(fā)助手插件我不滿意,你根據(jù)我的草圖重新設(shè)計下,我不希望是彈窗打開,而是tab頁面打開,UI設(shè)計參考我的草圖. 
接到需求后，開始賣力干活。
樣式有點不對，這個地方字體都顯示不對。沒關(guān)系，就是要經(jīng)過不斷的描述需求和檢查結(jié)果的過程。
選擇平臺這里文字沒法展示全, 請修改此地方, 其他無需修改, 現(xiàn)在樣式你可以自己看我給你的截圖. 。
好，修復(fù)好了。
在 obsidian 中直接進行插件開發(fā)有個好處就是，隨心所欲的絲滑。
指揮 Claude Code ，把之前需要切換應(yīng)用看效果這事直接省去。
只需要在第三方插件這個地方重新開關(guān)一下，就完成了重新加載。
經(jīng)過幾輪的調(diào)教，一個不辣么簡單的插件就開發(fā)好了。
可以一鍵轉(zhuǎn)為小紅書風(fēng)格：
即刻風(fēng)格：
X 風(fēng)格：
在整體設(shè)置上，支持進行大模型配置和平臺配置，甚至我還把提示詞也做了配置，你可以用默認提示詞也可以根據(jù)習(xí)慣自行更改。
未來的生產(chǎn)力，或許不再是誰能寫出更晦澀的算法，而是誰能更好地駕馭 AI，更快地構(gòu)建出有價值的產(chǎn)品。
希望這個插件和這篇教程，能幫你把我踩過的坑都填平。也希望你能拿起這個新的杠桿，去復(fù)活你項目列表里那個“一直想做，卻沒時間做”的絕妙想法。
感謝你閱讀這篇文章，我們下一期見！
特別聲明：以上內(nèi)容(如有圖片或視頻亦包括在內(nèi))為自媒體平臺“網(wǎng)易號”用戶上傳并發(fā)布，本平臺僅提供信息存儲服務(wù)。
Notice: The content above (including the pictures and videos if any) is uploaded and posted by a user of NetEase Hao, which is a social media platform and only provides information storage services.
