编译css / scss的目的是什么？

Question

我只是想知道，为什么我们需要设置我们的PHP / HTML项目来使用编译器？为什么我们不只是ctrl + s然后得到想要的结果？我要指出的是，使用编译器与使用基本ctrl + s保存Web应用程序有什么不同。谢谢。 ：）

Answer 1

我很困惑。问题标题是指编译CSS / SCSS，问题是编译PHP / HTML。由于您使用sass标记了问题，我假设您正在尝试询问为什么我们需要将SASS编译为CSS，而不是仅仅能够将SASS文件包含到我们的项目中？

如果是你的问题，那是因为SASS本身并不总是有效的CSS。这是一种更易于开发人员编写CSS的方法，因为在SASS中我们可以继承样式。例如，我们可以定义一个设置字体大小和权重的基本CSS类（例如.arial-big），然后我们可以在其他设置颜色的类中继承它（例如.arial-big-red和{{1 }}）。我们不必在这些类中设置字体大小和重量，因为我们可以从.arial-big-green继承。基本CSS不支持这样做。如果您从未使用任何这些功能，并且您的SASS文件包含已经有效的CSS代码，那么您为什么还要使用SASS呢？

现在这是一个非常简单的例子，它通常要复杂得多，并且可以从SASS中的多个CSS类继承。但就像我说的那样，这在常规CSS中无效，所以我们需要将SASS编译成浏览器能理解的基本CSS。

如果你想在SASS发生变化时自动编译你的SASS，那很可能。 JetBrains编辑器套件支持文件监视器，可以在文件更改时自动触发命令。当您在SASS文件上按CTRL + S时，可以将其设置为调用编译器。如果您使用的是其他编辑器，则它们可能具有相似的功能，或者您可以使用基本的OS功能执行相同的操作。我不确定Windows，但在Linux中你可以使用inotify / incron，OS X有自己的文件监视器功能，你可以在文件发生变化时挂钩调用编译器。

编辑：要添加到此项，如果您在PHP项目中使用SASS，那么当访问者尝试加载CSS时，可以使用库将SASS编译为CSS 。您可以使用指向属于该库的PHP文件，而不是使用指向预编译的CSS文件的.arial-big标记，并且此时它将编译SASS文件。一个例子是panique/php-sass。