Постобработка HTML после вставки в js строку в PhpStorm/WebStorm

В PhpStorm сейчас существуют сложности при вставке HTML размети c строку переменной Javascript. Я имею ввиду что-то подобное такой операции.

<div id="complex-module">
     <div class="container">
         <label for="first-name">
             <input id="first-name" type="text">
         </label>
     </div> 
</div> 
<script type="text/javascript">
     function render() {
         const markup = '';
     } 
</script>

Когда я переписываю статический HTML у меня часто возникает необходимость перенести разметку в переменную Javascript.
При попытке выполнить это мы получим вот такой результат, что не есть совсем хорошо.
<div id="complex-module"> 
</div> 
<script type="text/javascript"> 
    function render() { 
        const markup = '<div class="container">\n' + 
            '        <label for="first-name">\n' + 
            '            <input id="first-name" type="text">\n' + 
            '        </label>\n' + 
            '    </div>'; 
    } 
</script>

Желанным для меня является следующий результат
<div id="complex-module"> 
</div> 
<script type="text/javascript"> 
    function render() { 
        const markup = '<div class="container">' + 
                '<label for="first-name">' + 
                    '<input id="first-name" type="text">' + 
                '</label>' + 
            '</div>'; 
    } 
</script>

PhpStorm позволяет делать замены используя регулярные выражения, но мне всегда не хватало хотя бы маленького примера, чтобы научиться их правильно использовать.
После того, как я более близко познакомился с регулярными выражениями, я нашел способ как мне этого достичь.
Для этого я написал следующее выражение:
^([^'"]*)(['"])(\s*)(.*)\\n(['"].*)$
$1$3$2$4$5

А чтобы всё корректно сработало и на последней части строки разметки на просто нужно внутри возле закрывающей дописать \n. А дальше просто применяем выражение 🙂

Скринкаст с примером использования данного выражения

P.S: чтобы всё сработало корректно надо поставить галку активного режима регулярных выражений.

Диалог замены в PhpStorm
Диалог замены в PhpStorm

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *