Diffs — 来自 Pierre 的开源 Diff 与代码渲染库:基于 Shiki 构建极致语法高亮,支持并排/统一对比视图与行内实时编辑。

来自 Pierre 的开源 Diff 与代码渲染库:基于 Shiki 构建极致语法高亮,支持并排/统一对比视图与行内实时编辑。

包含组件

95
EditTreesDiffsHubPierrePlaygroundRendering DiffsMerge conflict resolution UIPackage ExportsBuild with agentsAgent skillPrompt an agentPlain-text docsCore TypesFileContentsFileDiffMetadataLineAnnotation and DiffLineAnnotationCreating DiffsReact APIPartial Diff HydrationShared PropsVanilla JS APIPropsRenderersCodeViewWhat It Gives YouCore ModelEditingPadding & GapHeader & FooterFile & Diff Size EstimationExamplesReact Item OwnershipEditing Item AnnotationsUsage NotesScroll TargetsRelationship To VirtualizationEdit modeEnable editingHandle changes and completionRetain edit state in memoryInitialize state on first attachPersist a draft across reloadsControl the editorExtend the editing UIPerformance and loadingEdit predictionAPI referenceKeyboard shortcutsVirtualizationReactVanilla JSNotesHunk SeparatorsBuilt-in TypesCustom CSS ExampleUtilitiesAnnotation type guardsdiffAcceptRejectHunkresolveMergeConflictdisposeHighlightergetSharedHighlighterparseDiffFromFileparsePatchFilestrimPatchContextpreloadHighlighterregisterCustomThemeregisterCustomLanguagesetLanguageOverrideStylingAdvanced: Unsafe CSSThemesToken HooksWorker PoolSetupUsageRender CacheArchitectureSSRPreloadersHighlightsHTMLTokensStreamingIncremental editingLanguagesSplit Diff View (Side-by-side)Stacked Diff View (Unified)In-line Code EditorMerge Conflict Resolver UIComments & AnnotationsAccept / Reject ActionsLine Selection & Gutter IndicatorsToken Hover TooltipsShiki Theming EngineCustom Hunk Separators

@pierre/diffs 是由 Pierre Computer 倾力打造的现代代码 Diff 呈现与对比编辑器。深度集成 Shiki 高亮引擎,原生支持全量 VS Code 主题色彩。提供分栏并排(Split)与行内堆叠(Stacked)两种标准布局模式,内置双向行内编辑能力、代码审查批注卡片、Git 冲突解决界面、语法 Token 悬停提示以及代码变更一键采纳/拒绝交互。