Codemirror diff

Question

我想使用codemirror（而不是合并工具）实现diff模式。类似的东西：git diff。我使用Codemirror官方diff模式，但是当用户添加或更改了某些内容时，无法获取tokenizer（+， - ）。

Answer 1

CodeMirror Diff 模式只是根据其格式突出显示一行（例如，如果行以“+”开头，则以绿色突出显示，如果以“-”开头，则以红色突出显示）。您需要自己生成差异文本。您可以使用多个库，例如 jsdiff

您可以像这样获得 2 个文本之间的差异：

import * as Diff from 'diff';

var text1=`
line1
line2
line3
`;

var text2=`
line0

line3

line4
line5
`;

var diff = Diff.createTwoFilesPatch('old', 'new', text1, text2, { context: 1 });
console.log('diff', diff);

它将产生以下差异：

diff ===================================================================
--- old [object Object]
+++ new
@@ -1,4 +1,7 @@
 
-line1
-line2
+line0
+
 line3
+
+line4
+line5

然后你可以把这段文字插入到 CodeMirror 中。