JS 正则表达式在关闭大括号和打开类/id 之间替换 SCSS 中的空行

Question

我正在尝试创建一个正则表达式来替换 SCSS 规则集之间的空行。 正则表达式应从右花括号匹配到类 (.) 或 id (#) 并删除任何行。 任何未放置在这些标识符之间的空行都不应受到影响，包括中间是否也有注释之类的内容。

我已经设置了一个可用于测试以下示例的小提琴： https : //jsfiddle.net/9y33cvtg/2/

例子：

前

// START

.test1 {
    background: #FFFFFF;

    .test2 {
        background: #FFFFFF;

        .test3 {
            background: #FFFFFF;
        }
    }
}

.test5 {
    background: #FFFFFF;
}

.test6 {
    background: #FFFFFF;
}

// Comment

.test7 {
    background: #FFFFFF;
}

---

后：

// START

.test1 {
    background: #FFFFFF;

    .test2 {
        background: #FFFFFF;

        .test3 {
            background: #FFFFFF;
        }
    }
}
.test5 {
    background: #FFFFFF;
}
.test6 {
    background: #FFFFFF;
}

// Comment

.test7 {
    background: #FFFFFF;
}

到目前为止，我已尝试使用以下方法，但没有奏效：

str.replace(/\}(.*?)\./g, '')

Answer 1

解析 CSS 文件应该使用专用库来完成。

以下解决方案只会执行以下操作：它将检测等于}后跟 1 个或多个空白字符的行，直到以点开头的行。 需要您自担风险使用它。

.replace(/^}$\s+^\.\b/gm, '}\n.')

请参阅正则表达式演示。

细节

• ^ - 行首（由于m修饰符）
• } - 一个}
• $ - 行尾
• \\s+ - 1 个或多个空格
• ^ - 一行的开始
• \\. - 一个点（注意：如果你想确保它后面跟着一些字符字符，你可以使用\\b甚至\\w ）

下面是一个 JS 演示：

 var str = document.querySelector('.string').innerText; var output = document.querySelector('.output'); output.innerText = str.replace(/^}$\\s+^\\.\\b/gm, '}\\n.');

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <strong>Input:</strong> <pre class="string"> // START .test1 { background: #FFFFFF; .test2 { background: #FFFFFF; .test3 { background: #FFFFFF; } } } .test5 { background: #FFFFFF; } .test6 { background: #FFFFFF; } // Comment .test7 { background: #FFFFFF; } </pre> <br> <strong>Output:</strong> <pre class="output"> </pre>

Answer 2

您好，您需要像这样捕捉换行符：

output.innerText = str.replace(/^}[\r\n]{2,}(?!\/\/)/gm, '}\n');

它似乎有效，告诉我它是否解决了您的问题