Question

编写CSS的流行方式如下：

#report-page aside.sidebar {
  …
}

  #report-page aside.sidebar li {
    …
  }

    #report-page aside.sidebar li a {
      …

写这个很乏味。我想尝试自动化重复的部分。（像LESS这样的预处理器可以解决这个问题，但我不能在现有的应用程序中使用它。）

Espresso.app可以插入动态文字片段：

    <!-- The matched suffix allows you to capture information about the text 
         preceding the insertion point. Specify a regular expression here. -->
    <matched-suffix>(\s+)(is a vegetable)?</matched-suffix>

    <!-- The transform-into element is a regex replacement expression, and can use 
    the captured strings from matched-suffix to generate a conditional snippet. -->
    <transform-into>(?2:\1is a vegetable:\1is fantastic and )</transform-into>

你能帮我写一个正则表达式来查找前一个大括号{，然后返回该行前面的任何内容，不包括制表符和空格吗？

Answer 1

像LESS这样的预处理器可以解决这个问题，但我不能在现有的应用程序中使用它。

是的，你可以。您的项目/框架不必支持它，您也不必重写整个CSS。

例如，scss的语法完全支持css的语法，因此您只需将.css文件重命名为.scss即可。之后，您可以开始使用scss语法。

请参阅http://sass-lang.com/

sass / scss工具有一个--watch开关，允许您在后台运行它，并在每次修改文件时自动将.scss文件转换为.css文件，同时开发：

sass --scss --watch file.scss:file.css

如果您更喜欢sass语法，sass附带sass-convert工具，可以转换为css，scss和{{1}格式：

sass

对于你的正则表达式问题，试试这个：

sass-convert --from css --to sass file.css file.sass

这将匹配选择器，在选择器之前和之后没有空格/缩进。

Answer 2

^[^{]+

此正则表达式匹配从行首到第一个开始花括号的所有文本。它将匹配没有花括号的线上的整行;如果这是一个问题，最后添加一个文字大括号。

^[^{]+\{

疯狂的正则表达式：追加以前的CSS选择器

2 个答案: