Question

我正在编译一个SCSS文件，它似乎删除了我的注释。我可以使用什么命令保留所有评论？

>SASS input.scss output.css

我在SCSS中看到两种类型的注释。

// Comment

和

/* Comment */

有什么区别？

Answer 1

两种评论之间的区别非常简单：

// Some comment for a single line

和

/* This is 
a multiline comment
for large descriptions */

根据the officials docs of SASS，您只能使用多行注释选项将其保存到编译的输出文件中。

与Sass一样，SCSS支持保存在CSS输出中的注释和不保留的注释。但是，SCSS的注释要灵活得多。 它支持带有/ * * /的标准多行CSS注释，这些注释将保留在输出中。这些注释可以具有您喜欢的任何格式； Sass会尽力格式化它们。

SCSS也将//用于抛出的评论，例如Sass。不过，与Sass不同，// SCSS中的注释可能出现在任何地方，并且只能持续到行尾。

因此，以下CSS：

/* This comment
should be kept
and not be thrown away */
.class {
    margin: 0 auto;
}

// This comment will be thrown away
.extra-class {
    color: blue;
}

将被编译为：

/* This comment
should be kept
and not be thrown away */
.class {
    margin: 0 auto;
}

.extra-class {
    color: blue;
}

要解决编译问题，您需要将//转换为/* */注释。

Answer 2

由于@Roy上面说的，多行注释（/ * * /）保持在导致CSS，但它取决于格式使用的是预先处理你的SASS。

如果您使用的是紧凑模式或任何其他“ CSS缩小器” ，则最好使用

/*! important comment */

这些注释也保存在CSS的精简版（缩小版）中。

示例：

html {
     /*! important comment */
     -webkit-box-sizing: border-box;
     box-sizing: border-box;
}

结果（紧凑，精缩版）：

html{/*! important comment */-webkit-box-sizing:border-box;box-sizing:border-box}

SASS编译并带有注释

2 个答案: