JS регулярные выражения добавить что-то перед скобкой

Question

У меня есть следующая строка:

@something {
  color: red;
  background: yellow;
}

Я пытаюсь добавить heyaaa перед закрывающей скобкой, например ..

@something {
  color: red;
  background: yellow;
  heyaaa
}

Я использую gulp string замените для поиска в файле css для @something и добавьте необходимую строку heyaaa перед закрывающей скобкой.

Я пробовал следующее, но не работает ...

.pipe(replace('^(\@something\s*{(?:\n.*)*?\n)}', 'heyaaa'))

Другие регулярные выражения работают, поэтому я знаю, что с моей настройкой все в порядке.

Answer 1

Один из способов - захватить все до последнего } в группе и в функции обратного вызова заменить использовать эту захваченную группу вместе со значением, которое вы хотите.

let str = `@something {
  color: red;
  background: yellow;
}`

let op = str.replace(/^(@something\s*[\w\W]+)}$/g,function(_,g1){
  return g1 + '  heyya,\n}'
})

console.log(op)

Answer 2

Вы захватываете деталь от начала до последней точки с запятой в группе, и после этого вы соответствуете закрывающей фигурной скобке.Но чтобы вернуть это в замену, вы должны обратиться к группе захвата.То, что вы сопоставили, не будет, потому что вы заменяете то, что вы сопоставили.

Чтобы исправить свое регулярное выражение, вы можете захватить последние } в группе ^(\@something\s*{(?:\n.*)*?\n)(}) и в замене обратиться к этим группам.

const regex = /^(\@something\s*{(?:\n.*)*?\n)(})/gm;
const str = `@something {
  color: red;
  background: yellow;
}`;
const subst = `$1  heyaa\n$2`;
const result = str.replace(regex, subst);
console.log(result);

Чтобы принять во внимание начало строки и отступ последней строки, вы можете сопоставить первую строку, а затем повторить, не глядя на новую строку, а затем}.

Вы можете захватить пробельные символы в начале в группе захвата и сослаться на это в замене, чтобы соответствовать отступу для heyaaa:

^(@[^{]+{\s*(?:(?!\n})(\s+).*\n)*)(})

Объяснение шаблона

• ^ Старт
• ( Группа захвата
  • @[^{]+{\s* Совпадение @, 1 + время не {.Затем сопоставьте { и 0+ с символом пробела
  • (?: Группа без захвата
    • (?!\n})(\s+).*\n Подтвердите, что справа нет новой строки, за которой следует }.Если это так, сопоставьте всю строку с новой строкой
  • )* Закройте группу и повторите 0+ раз
• ) Закрыть группу захвата
• (}) Круглая скобка захвата захвата
• $ Конец

При замене вы можете использовать 3 группы захвата:

$1$2heyaaa\n$3

Regex demo

Используя функцию обратного вызова, ваш код может выглядеть следующим образом:

.pipe(replace(/^(@[^{]+{\s*(?:(?!\n})(\s+).*\n)*)(})/, function(_,g1,g2,g3) { 
    return g1 + g2 + "heyaaa\n" + g3; }
    )
)

const regex = /^(@[^{]+{\s*(?:(?!\n})(\s+).*\n)*)(})/gm;
const str = `@something {
  color: red;
  background: yellow;
}`;
const subst = `$1$2heyaaa\n$3`;
const result = str.replace(regex, subst);
console.log(result);

Answer 3

Проблема во втором параметре функции replace: ваш код заменяет то, что соответствует heyaaa вместо вставки heyaaa в нужное место.

Вы можете просто сделать следующее:ссылаясь на $1 (первая соответствующая группа ) во втором параметре ( замена ):

const input = `@something {
  color: red;
  background: yellow;
}

@otherthing {
  color: red;
  background: yellow;
}
`

const regex = /^(\@something+\s*{(?:\n.*)*?\n)}/gm

const result0 = input.replace(regex, 'NEW TEXT TO BE INSERTED') // Original substitution
const result1 = input.replace(regex, '$1  NEW TEXT TO BE INSERTED\n}') // Fixed substitution

console.log(result0) // Original result
console.log(result1) // Fixed result

ОБНОВЛЕНО: ОБЪЯСНЕНИЕ

Я добавил суффикс m для многострочного совпадения с регулярным выражением и суффикс g для множественного сопоставления (без него выражение являетсяприменяется только к первому совпадению).

Если вам нужно добавить NEW TEXT TO BE INSERTED в конце каждого класса CSS, вы должны изменить @something на @[^\s] в регулярном выражении (см. следующий фрагмент).

const input = `@something {
  color: red;
  background: yellow;
}

@otherthing {
  color: red;
  background: yellow;
}
`

const regex = /^(\@[^\s]+\s*{(?:\n.*)*?\n)}/gm

const result = input.replace(regex, '$1  NEW TEXT TO BE INSERTED\n}') // Fixed substitution

console.log(result) // Fixed result