I would like to use Sass based styles in my Symfony 2.7 WebApp. So far I have used Compass to compile Sass files (located not in the web/ dir but within the Bundles) to CSS files. This works fine, but on a new server Ruby is not available and thus Compass is not an option anymore.
Following the Symfony Docu, I have added leafo/scssphp to the project and activated in the config file:
# app/config/config.yml
assetic:
filters:
scssphp:
formatter: 'Leafo\ScssPhp\Formatter\Compressed'
# ...
The Sass files within the Twig templates:
{% stylesheets
'MyMainBundle/Resources/styles/sass/header.scss'
filter="scssphp"
output="css/header.css" %}
<link rel="stylesheet" href="{{ asset_url }}" />
{% endstylesheets %}
This works fine when using Symfony in non-dev mode:
php app/console assetic:dump --env=prod --no-debug
The file web/css/header.css is created and everything works without any problem. However, when using the app_dev.php front controller, no styles from header.scss are applied. Only styles from other files which are linked directly (without using Assetic) are rendered.
This strange, because when I inspect the generated/loaded HTML file, the style sheet seems to be included correctly:
<link rel="stylesheet" href="/app_dev.php/css/header_header_1.css" />
Calling /app_dev.php/css/header_header_1.css directly shows the style sheet with all its styles.
So all styles seem to be in place. Everything as it should be. Except, that no styles are being rendered.
Do you have any idea how to solve this?
I managed to solve the problem: The css file was transferred with Content-Type: text/htmlinstead of text/css. This was caused by the format_listener settings of the FOSRestBundle. Adding css to the accept rules solved this. The css files are now transferred as text/css and everything works fine.