Как сохранить переменные PHP в таблицах стилей CSS, сгенерированных SASS / SCSS? - PullRequest
0 голосов
/ 03 февраля 2012

Я работаю над новым крупным проектом PHP / Symfony 2 и решил использовать Sass / SCSS и Compass, которые, как мне показалось, действительно хороши для управления CSS современным способом. Однако есть еще одна проблема, на которую я не смог найти никакого ответа: как поместить переменные PHP в исходные файлы SCSS и сохранить их в выходных файлах CSS?

Это не мелочь, потому что без этой функциональности невозможно было бы связать сгенерированные Sass таблицы стилей с PHP, которые могли бы реально ограничивать некоторые большие проекты.

Для ясности, и в качестве отправной точки, классическим способом мы можем связать CSS с PHP в основном так:

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

, а затем в псевдо-CSS-файле layout.css.php, как в примере выше:

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

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

Теперь, как я могу сделать что-то эквивалентное в SCSS / Compass? Другими словами, как поместить некоторые переменные PHP в исходные файлы SCSS, которые будут сохранены как есть в конечном выходном файле CSS, чтобы его можно было в дальнейшем анализировать в реальном времени с помощью PHP, как в примере выше?

Когда я пытаюсь сделать это, компас и SASS не работают из-за синтаксиса PHP.

Phamlp имеет несколько фильтров для PHP, которые применяются только к шаблонам haml, но не к файлам SCSS.

LESSphp, похоже, имеет такую ​​функциональность , но многие люди, похоже, переходят с LESS на SCSS / Compass, так какой же самый лучший подход?

Большое спасибо.

1 Ответ

3 голосов
/ 03 февраля 2012

Я действительно не думаю, что вы хотите делать то, что пытаетесь сделать.

Одним из основных преимуществ таких языков, как Sass, LESS и Stylus (примечание: я считаю, Stylus - более мощный и гибкий язык, чем Sass), является то, что они предварительно обрабатываются до чистого CSS, который затем может кэшироваться браузерами или распространяться CDN. Если вы затем запустите этот статический контент через PHP, вы полностью потеряете это преимущество.

Я считаю, что в наши дни правильный способ получить контент в динамическом стиле, которого вы, похоже, пытаетесь достичь, - это использовать Javascript: пусть ваше приложение доставит статический файл JS, а затем дополнит его динамическими данными . В этом примере у вас была бы функция, которая спрашивает сервер "какой цвет фона предпочитается пользователем?" (либо через XMLHttpRequest, либо через просмотр объекта JSON, доставляемого вместе с оригинальной страницей, написанной на PHP). Затем он устанавливает соответствующие свойства для соответствующего элемента (ов) или его (их) класса (ов), возможно, используя вспомогательную библиотеку, такую ​​как jQuery.

Этот подход имеет большие преимущества по сравнению с генерацией CSS на стороне сервера (например, правильное кэширование, больший объем статического содержимого на стороне сервера, что означает лучшую отзывчивость сайта, улучшенное разделение проблем, более простую реализацию альтернативных пользовательских интерфейсов, поскольку сервер не не устанавливайте свойства дисплея, ...) - и единственный недостаток в том, что для него требуется браузер с поддержкой JS. Пожалуйста, примите это во внимание.

...