Agent Skills › pierrecomputer/pierre › diffs

diffs

GitHub

用于渲染语法高亮代码文件、差异对比、补丁及合并冲突，支持React、SSR、Worker及自定义主题，提供编辑和审查界面功能。

skills/diffs/SKILL.md pierrecomputer/pierre

Trigger Scenarios

需要渲染或编辑代码差异构建代码审查界面处理合并冲突可视化

Install

npx skills add pierrecomputer/pierre --skill diffs -g -y

More Options

Use without installing

npx skills use pierrecomputer/pierre@diffs

指定 Agent (Claude Code)

npx skills add pierrecomputer/pierre --skill diffs -a claude-code -g -y

安装 repo 全部 skill

npx skills add pierrecomputer/pierre --all -g -y

预览 repo 内 skill

npx skills add pierrecomputer/pierre --list

SKILL.md

Frontmatter

{
    "name": "diffs",
    "description": "Use when an app uses @pierre\/diffs to render or edit code files, diffs, patches, merge conflicts, or CodeView review surfaces, including React, vanilla JavaScript, SSR, workers, annotations, selection, and custom Shiki languages or themes."
}

`@pierre/diffs`

Use @pierre/diffs to render syntax-highlighted files and diffs. Use its optional editor, SSR, and worker entries for those capabilities.

Install

pnpm add @pierre/diffs

Install react and react-dom when the app uses the React entry.

Select an API reference

Surface	Reference
Root components, parsing, and file extension APIs	Core API
Languages, themes, highlighter state, and streams	Highlighting API
Renderers, managers, DOM helpers, comparisons, and constants	Low-level rendering API
Shared data, option, render, selection, and editor types	Shared types
`@pierre/diffs/react`	React API
`@pierre/diffs/edit`	Editor API
`@pierre/diffs/ssr`	SSR API
`@pierre/diffs/worker` and worker scripts	Worker API

Select a recipe

Task	Recipe
Render a file or diff in React	Render with React
Render a file or diff without React	Render with vanilla JavaScript
Build a virtualized review surface	Use CodeView
Edit a React surface or CodeView	Edit with React
Edit a vanilla surface or CodeView	Edit with vanilla JavaScript
Preload markup on the server	Use SSR
Highlight through a worker pool	Use workers
Add line annotations and selection	Add annotations and selection
Register a Shiki language or theme	Register custom highlighting