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');

它似乎有效，告訴我它是否解決了您的問題