[英]vscode extension API editor.replace replace only first match while match 2 instances
developing an VS code extension where开发 VS 代码扩展,其中
although it match all color hex code but replace the only first instance and stops虽然它匹配所有颜色的十六进制代码但只替换第一个实例并停止
below is the code snippet下面是代码片段
export function activate(context: vscode.ExtensionContext) {
let activeEditor = vscode.window.activeTextEditor;
function replaceWithinDocument() {
if (!activeEditor) {
return;
}
const text = activeEditor.document.getText();
const reg = new RegExp('(?<color>#[0-9a-f]{3,6})', 'gim');
const matches = text.matchAll(reg);
const variableList = {};
let i = 0;
for (const match of matches) {
const { index, groups } = match;
i++;
console.log({ match });
const startPos = activeEditor.document.positionAt(index!);
const endPos = activeEditor.document.positionAt(index! + match[0].length);
console.log({ i, startPos, endPos });
//Creating a new range with startLine, startCharacter & endLine, endCharacter.
let range = new vscode.Range(startPos, endPos);
// eslint-disable-next-line @typescript-eslint/naming-convention
Object.assign(variableList, { [`--var-${i}`]: groups?.color });
activeEditor.edit(editBuilder => {
editBuilder.replace(range, `--var-${i}`);
});
}
console.log({ variableList });
}
function triggerUpdateDecorations(throttle = false) {
if (timeout) {
clearTimeout(timeout);
timeout = undefined;
}
if (throttle) {
timeout = setTimeout(replaceWithinDocument, 500);
} else {
replaceWithinDocument();
}
}
if (activeEditor) {
triggerUpdateDecorations();
}
final document最后文件
body {
background-color: --var-1;
color: #223344;
}
you can see in the screenshot that console.log({ variableList });
您可以在屏幕截图中看到
console.log({ variableList });
have both color code in it里面有两种颜色代码
so what is wrong here?那么这里出了什么问题?
See allow delay between edits via vscode extension api .请参阅通过 vscode 扩展 api 允许编辑之间的延迟。 Because of the particular nature of the
editBuilder
object由于editBuilder的
editBuilder
The editBuilder "expires" once you return from the callback passed to TextEditor.edit.
一旦您从传递给 TextEditor.edit 的回调返回,editBuilder 就会“过期”。
you should put your matches
loop inside the call to the edit
call like this sample code:你应该把你的
matches
循环放在对edit
调用的调用中,就像这个示例代码一样:
// get your matches above first
editor.edit(editBuilder => {
let i = 0;
for (const match of matches) {
// build your replacement here
const matchStartPos = document.positionAt(match.index);
const matchEndPos = document.positionAt(match.index + match[0].length);
const matchRange = new Range(matchStartPos, matchEndPos);
editBuilder.replace(matchRange, resolvedReplace);
}
}).then(async (resolved) => {
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.