css - 如何删除具有特定前缀的所有类(使用 Visual Studio Code)？

Question

我是一个基于 Angular 的 HTML 元素的交互设计师。我正在尝试基于另一个团队制作的模板创建一个新的 HTML 模板。我使用 Firebug 捕获现有的 HTML 并在 Visual Studio Code 中对其进行修改。

除了对我有用的 HTML 之外，我还得到了大量的 ng-和 cs- (我假设)用于填充模板的标签、属性、类和注释。我想将它们全部删除。

此时，我已经成功地使用以下正则表达式删除了评论、标签和属性:

(<!--.*(ngIf|ngRepeat|ngInclude).*-->)|(</{0,1}(ng|cs)-.*>)|((ng|cs)-[a-z-]*="[^"]*")

分解:

• 评论:<!--.*(ngIf|ngRepeat|ngInclude).*-->
• 标签:</{0,1}(ng|cs)-.*>
• 属性:(ng|cs)-[a-z-]*="[^"]*"

但目前我被困在类里面。我可以找到我想删除的东西:(class="[^"]*)ng-[-a-z]*([^"]*") (限制:每个 ng- 属性仅删除一个 class 类)，但我不能使用 \1\2 来替换它们. Visual Studio Code 似乎在查找字段中支持正则表达式，但在替换字段中不支持。

如何进行？

Answer 1

使用美元符号在 Visual Studio Code 中定义反向引用。

好吧，我应该对您的正则表达式再发表一些评论:

• 评论正则表达式仅适用于单行评论。如果一行可以有两个或更多，使用 <!--(?:(?!-->).)*(ngIf|ngRepeat|ngInclude).*?--> (注意经过调节的贪婪 token (?:(?!-->).)* )
• </{0,1}(ng|cs)-.*> 可能会出现类似的问题- 使用否定字符类 [^<]*?以防止任何标签溢出 - </?(ng|cs)-[^<]*?> (请注意，应使用 <，因为 > 通常未序列化，而 {0,1} 限制量词实际上等于 ?)

请注意，以 VSCode 1.29 开头, 你需要 enable search.usePCRE2 option在您的正则表达式模式中启用前瞻。