如何使PHP变量保留在SASS / SCSS生成的CSS样式表中？ [英] How to make PHP variables preserved in CSS stylesheets generated by SASS / SCSS?

问题描述

我正在开发一个新的大型PHP / Symfony 2项目，因此决定使用Sass / SCSS和Compass，我发现它们都非常适合以现代方式管理CSS。但是，仍然有一个我找不到答案的问题：如何将PHP变量放置在原始SCSS文件中并使它们保留在输出CSS文件中？

I'm working on a new big PHP / Symfony 2 project and decided to use Sass / SCSS and Compass which I found both really awesome for managing CSS in a modern way. However, there's still one problem for which I couldn't find any answer: how to place PHP variables in original SCSS files and make them preserved in output CSS files?

这并不是一个细节，因为如果没有此功能，就无法将Sass生成的样式表与PHP交互，这在某些大型项目中可能确实受到限制。

This is not a detail, because without this functionality there's no way to interface Sass generated stylesheets with PHP, which could be really limitating in some big projects.

明确且作为起点，我们可以通过经典方式将CSS与PHP进行接口连接，主要是这样：

<link type="text/css" href="layout.css.php?my_var=#CC0000" rel="stylesheet" />

然后是伪CSS文件layout.css.php，如上例所示：

and then in a pseudo CSS file layout.css.php like in the example above:

<?php header("Content-type: text/css");?>

.my_color {
  background-color:<?=$_GET['my_var']?>;
}

---

现在，如何在SCSS /指南针中做一些等效的事情？换句话说，如何在原始SCSS文件中放置一些PHP变量，并将其保留在最终CSS输出文件中，以便可以像上面的示例一样使用PHP进一步对其进行实时解析？

当我尝试执行此操作时，由于PHP语法，指南针和SASS编译器失败。

When I try to do this Compass and SASS compilers fail because of the PHP syntax.

Phamlp 具有一些仅适用于haml模板而不适用于SCSS文件的PHP过滤器。

Phamlp has some filters for PHP that only apply to haml templates, not SCSS files.

LESSphp似乎具有此类功能，但很多的人似乎已经从LESS转移到SCSS / Compass，那么最好的方法是什么？

LESSphp seems to have such functionality, but lots of people seem to be moving from LESS to SCSS / Compass, so what is the best approach?

非常感谢。

推荐答案

我真的不认为您想做自己想做的事情。

I really don't think you want to do what you're trying to do.

其中一项主要Sass，LESS和Stylus等语言的优势（注意：我相信手写笔是比Sass更强大，更灵活的语言），因为它们可以预处理为裸CSS，然后可以由浏览器缓存或由CDN分发。如果您随后通过PHP运行那些原本静态的内容，则会完全失去这一优势。

One of the major advantages of languages like Sass, LESS, and Stylus (NB: I believe Stylus is a more powerful and flexible language than Sass) is that they preprocess down to bare CSS which can then be cached by browsers or distributed by a CDN. If you then run that otherwise-static content through PHP, you completely lose that advantage.

我相信，在当今这一时代，拥有动态样式化内容（例如，您似乎想要实现的目标是使用Javascript：让您的应用程序提供静态JS文件，然后使用动态的 data 对其进行扩充。在此示例中，您将具有一个询问服务器用户首选的背景颜色是什么？的函数。 （通过XMLHttpRequest或通过查看与原始PHP编写的页面一起提供的JSON对象）。然后，它可能使用诸如jQuery之类的帮助程序库在适当的元素或元素的类上设置适当的属性。

I believe in this day and age the correct way to have dynamically-styled content like you seem to be trying to achieve is to use Javascript: have your application deliver a static JS file, then augment it with dynamic data. In this example, you would have a function which asks the server "what is the user's preferred background color?" (either via an XMLHttpRequest or via looking at a JSON object delivered along with the original PHP-written page). Then it sets the appropriate properties on the appropriate element(s) or class(es) thereof, possibly using a helper library such as jQuery.

服务器端CSS生成（例如适当的缓存，大量服务器端静态内容，这意味着更好的站点响应能力，改进的关注点分离，由于服务器未设置显示属性而更易于实现备用UI，... ）-唯一的缺点是它需要启用JS的浏览器。请考虑一下。

This approach has major advantages over server-side CSS generation (such as proper caching, a greater amount of server-side static content which means better site responsiveness, improved separation of concerns, greater ease of implementing alternate UIs since the server isn't setting display properties, ...) - and just about the only drawback is that it requires a JS-enabled browser. Please, consider it.

这篇关于如何使PHP变量保留在SASS / SCSS生成的CSS样式表中？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！