openpencil/apps/cli/README.zh-TW.md
Kayshen Xu b4d1d2a7bb
V0.5.1 (#77)
* fix(docker): support multi-platform builds and fix monorepo paths

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

* perf(renderer): cache pre-rasterized paragraph images to avoid per-frame glyph rasterization   (#76)

* fix(canvas): stabilize frame label size during zoom

  Draw frame labels in screen-space after the viewport transform
  restore, converting scene coords manually. Previously fontSize=12/zoom
  fed into Math.ceil caused integer-boundary jumps that made labels
  flicker during zoom. Also skip shadow rendering while actively
  zooming for smoother performance.

* perf(renderer): cache pre-rasterized paragraph images to avoid per-frame glyph rasterization

   - Add paraImageCache (SkImage, 128 MB LRU limit) keyed on the same key as paraCache
   - Use drawImageRect instead of drawParagraph on cache hit, skipping per-frame glyph shaping and rasterization
   - Fall back to direct drawParagraph only when off-screen surface creation (MakeSurface) fails
   - Extract _dpr getter to deduplicate device-pixel-ratio resolution logic across draw paths
   - Evict oldest entries when cache exceeds byte limit; delete SkImage on eviction and dispose()

* feat(cli): introduce OpenPencil CLI for terminal control of the design tool

- Added a new CLI application under `apps/cli` to manage OpenPencil from the terminal.
- Implemented commands for app control (`start`, `stop`, `status`), document operations (`open`, `save`, `get`, `selection`), and design manipulation (`design`, `import`).
- Enhanced documentation with usage instructions and platform support details.
- Updated build scripts to include CLI compilation and publishing processes.
- Introduced a new GitHub Actions workflow for publishing the CLI to npm.
- Updated existing workflows to integrate CLI build steps and ensure proper versioning across packages.

* docs: update README files to include CLI tool details and multi-platform code export

- Added CLI section to README files in multiple languages, detailing commands for terminal control of the design tool.
- Included instructions for global installation and usage examples for the CLI.
- Expanded documentation on multi-platform code export capabilities from a single `.op` file to various frameworks.
- Updated CLAUDE.md to reference the new CLI documentation and its integration with the design tool.

* chore(bun.lock): update package dependencies to specific versions

- Removed workspace references for several packages in the bun.lock file.
- Updated dependencies for `@zseven-w/pen-core`, `@zseven-w/pen-types`, `@zseven-w/pen-codegen`, `@zseven-w/pen-figma`, and `@zseven-w/pen-renderer` to version `0.5.1-beta.1`.
- Ensured consistency in dependency management across the project.

---------

Co-authored-by: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Co-authored-by: leinaldo <60176594+leinaldo@users.noreply.github.com>
2026-03-23 21:20:59 +08:00

3.9 KiB
Raw Blame History

@zseven-w/openpencil

English · 简体中文 · 繁體中文 · 日本語 · 한국어 · Français · Español · Deutsch · Português · Русский · हिन्दी · Türkçe · ไทย · Tiếng Việt · Bahasa Indonesia

OpenPencil 的命令列工具 — 從終端機控制設計工具。

安裝

npm install -g @zseven-w/openpencil

平台支援

CLI 會自動偵測並啟動所有平台上的 OpenPencil 桌面應用程式:

平台 偵測的安裝路徑
macOS /Applications/OpenPencil.app~/Applications/OpenPencil.app
Windows NSIS 使用者安裝(%LOCALAPPDATA%)、全域安裝(%PROGRAMFILES%)、可攜版
Linux /usr/bin/usr/local/bin~/.local/bin、AppImage~/Applications~/Downloads、Snap、Flatpak

使用方式

op <command> [options]

輸入方式

接受 JSON 或 DSL 的參數可透過三種方式傳入:

op design '...'              # 內嵌字串(適合小型內容)
op design @design.txt        # 從檔案讀取(建議用於大型設計)
cat design.txt | op design - # 從標準輸入讀取(管線傳輸)

應用程式控制

op start [--desktop|--web]   # 啟動 OpenPencil預設為桌面版
op stop                      # 停止執行中的實例
op status                    # 檢查是否正在執行

設計(批次 DSL

op design <dsl|@file|-> [--post-process] [--canvas-width N]
op design:skeleton <json|@file|->
op design:content <section-id> <json|@file|->
op design:refine --root-id <id>

文件操作

op open [file.op]            # 開啟檔案或連線至即時畫布
op save <file.op>            # 儲存目前的文件
op get [--type X] [--name Y] [--id Z] [--depth N]
op selection                 # 取得目前畫布的選取項目

節點操作

op insert <json> [--parent P] [--index N] [--post-process]
op update <id> <json> [--post-process]
op delete <id>
op move <id> --parent <P> [--index N]
op copy <id> [--parent P]
op replace <id> <json> [--post-process]

程式碼匯出

op export <format> [--out file]
# 格式react, html, vue, svelte, flutter, swiftui, compose, rn, css

變數與主題

op vars                      # 取得變數
op vars:set <json>           # 設定變數
op themes                    # 取得主題
op themes:set <json>         # 設定主題
op theme:save <file.optheme> # 儲存主題預設
op theme:load <file.optheme> # 載入主題預設
op theme:list [dir]          # 列出主題預設

頁面

op page list                 # 列出頁面
op page add [--name N]       # 新增頁面
op page remove <id>          # 移除頁面
op page rename <id> <name>   # 重新命名頁面
op page reorder <id> <index> # 重新排序頁面
op page duplicate <id>       # 複製頁面

匯入

op import:svg <file.svg>     # 匯入 SVG 檔案
op import:figma <file.fig>   # 匯入 Figma .fig 檔案

版面配置

op layout [--parent P] [--depth N]
op find-space [--direction right|bottom|left|top]

全域旗標

--file <path>     目標 .op 檔案(預設:即時畫布)
--page <id>       目標頁面 ID
--pretty          人類可讀的 JSON 輸出
--help            顯示說明
--version         顯示版本

授權條款

MIT