玉墨是一個以 Go、Wails v3 與 React 製作的跨平台文字與程式碼編輯器。它提供輕量的多分頁編輯體驗,並內建 Markdown 與 SVG 即時預覽,適合撰寫筆記、文件、向量圖與小型程式碼檔案。
- 新增、開啟、儲存、另存新檔與關閉分頁。
- 同時開啟多個檔案;再次開啟已載入的檔案時會切換至既有分頁。
- 未儲存的分頁會顯示修改狀態,關閉前會要求確認。
- 內建檔案選擇與儲存對話框。
- 偵測二進位檔,避免誤以文字模式開啟。
- 行號欄與編輯區同步捲動。
- Go、PHP、Python、HTML 與 SVG 的語法著色。
- 字型縮放:
Ctrl++、Ctrl+-、Ctrl+0。 - 支援常用快捷鍵:
Ctrl+N:新增檔案Ctrl+O:開啟檔案Ctrl+S:儲存Ctrl+Shift+S:另存新檔Ctrl+W:關閉目前分頁
開啟副檔名為 .md 或 .markdown 的檔案時,預設顯示左側編輯、右側即時預覽。每次修改 Markdown 內容後,預覽會立即更新。
- 可在「編輯」、「分割預覽」與「預覽」三種模式間切換。
- 支援 GitHub Flavored Markdown(標題、清單、表格、連結、圖片、程式碼區塊、引用等)。
- 預覽輸出會先經過 HTML 淨化處理,避免不安全內容注入應用程式頁面。
- 窄螢幕時,分割畫面會自動改為上下排列。
開啟副檔名為 .svg 的檔案時,預設顯示左側原始碼編輯、右側即時預覽。每次修改 SVG 內容後,預覽會立即更新。
- 可在「編輯」、「分割預覽」與「預覽」三種模式間切換。
- SVG 預覽使用透明背景棋盤格,方便辨識圖像的透明區域。
- 預覽會在 sandbox iframe 中呈現,隔離 SVG 內可能包含的指令碼。
- 開啟與另存新檔對話框皆提供
.svg檔案篩選。
- 開啟檔案時自動嘗試辨識 UTF-8、Big5 與 GBK。
- 可在狀態列選擇以 UTF-8、Big5 或 GBK 儲存。
- 狀態列顯示目前檔案路徑、行數、字元數、字型大小與編碼。
- 後端:Go 1.26+
- 桌面框架:Wails v3
- 前端:React、TypeScript、Vite
- 語法著色:PrismJS
- Markdown:Marked + DOMPurify
- Go 1.26 或以上
- Node.js 與 npm
- Wails v3 CLI
- Windows 平台需安裝 WebView2 Runtime
安裝 Wails CLI:
go install github.com/wailsapp/wails/v3/cmd/wails3@latest若要執行完整編譯流程,另需安裝 Task:
go install github.com/go-task/task/v3/cmd/task@latest首次執行或更新前端相依套件後,先安裝前端套件:
cd frontend
npm install
cd ..接著從專案根目錄啟動 Wails 開發模式:
wails3 dev若 wails3 尚未加入 PATH,可在 Windows 使用:
& "$env:USERPROFILE\go\bin\wails3.exe" dev請不要使用
go run main.go作為日常開發方式。此專案需要 Wails 同時啟動桌面 WebView 與 React 前端,應使用wails3 dev。
建立發行版:
task build單獨建置前端:
cd frontend
npm run build執行後端測試與靜態分析:
go test ./...
go vet ./...重新產生前後端繫結:
wails3 generate bindings.
├── app.go # Wails 對前端公開的檔案操作 API
├── main.go # 桌面應用程式進入點
├── internal/
│ ├── editor/ # 文件內容與修改狀態模型
│ └── fs/ # 讀寫檔案、編碼偵測與二進位檔判斷
├── frontend/
│ └── src/
│ ├── components/ # 編輯器、分頁、選單、狀態列及 Markdown/SVG 預覽
│ └── App.tsx # 前端分頁與檔案操作流程
└── Taskfile.yml # 開發、建置與驗證工作
本專案採用 MIT License。