Symfony2-Assetic-загрузка изображений в CSS



у меня есть CoreBundle, который содержит основные файлы css и изображения. Теперь у меня есть проблема, когда я загружаю изображение из css; изображение не отображается.



 background-image:url(../images/file.png)


(С полным путем он работает)



я установил активы с помощью команды:assets:install web и я вижу изображение и css файлы под web/bundles/cmtcore/(css|images).



вот файловая структура внутри основного пакета:



/CoreBundle
/Resources
/public
/css
/main.css
/images
/file.png


и вот как я загружаю файл css в шаблон:



 {% stylesheets '@CmtCoreBundle/Resources/public/css/*' %}
<link rel="stylesheet" type="text/css" media="screen" href="{{ asset_url }}" />
{% endstylesheets %}


Спасибо за вашу помощь заранее.

657   9  

9 ответов:

использовать cssrewrite фильтр из Assetic bundle

в config.yml:

assetic:
    debug:          %kernel.debug%
    use_controller: false
    filters:
        cssrewrite: ~

а затем назовите свои таблицы стилей так:

 {% stylesheets 'bundles/cmtcore/css/*' filter='cssrewrite' %}
        <link rel="stylesheet" type="text/css" media="screen" href="{{ asset_url }}" />
 {% endstylesheets %}

О, и не забудьте использовать php app/console assetic:dump

было несколько проблем с ccsrewrite:

фильтр CssRewrite не работает при использовании синтаксиса @MyBundle в AsseticBundle для ссылки на активы. Это известное ограничение.

вот версия php для cssrewrite:

<?php 
    foreach ($view['assetic']->stylesheets(array(
        'bundles/test/css/foundation/foundation.css',
        'bundles/test/css/foundation/app.css',
        'bundles/test/css/themes/adapzonManager.css'), array('cssrewrite')) as $url):
?>
    <link rel="stylesheet" href="<?php echo $view->escape($url) ?>" />
<?php endforeach; ?>

Я решил проблему, следуя инструкциям на этом сайте: http://www.craftitonline.com/2011/06/symfony2-beautify-with-assetic-and-a-template-part-ii/

фактическая проблема заключается в том, что вы ссылаетесь на свои ресурсы bundle absolute, но должны ссылаться на них относительно.

{% stylesheets filter='cssrewrite' output='css/*.css'
    'bundles/blistercarerisikobewertung/css/*'  %}
    <link href="{{ asset_url }}" type="text/css" rel="stylesheet" />
{% endstylesheets %}

очистить кэш и установите ваши активы снова

Что касается ответа Янна, на самом деле вам не нужно повторно устанавливать активы после каждого изменения, если вы используете .

обратите внимание, однако, что запуск сценария установки поставщиков перезапишет символические ссылки, поэтому вам нужно будет удалить bundles/* папки и установить активы с --symlink опция снова после запуска сценария поставщиков.

Я разработал небольшой пакет с дополнительным фильтром для решения этой проблемы. Вы можете найти его на github:https://github.com/fkrauthan/FkrCssURLRewriteBundle.git

с этим пакетом @ Notation для assetic работает, если у вас есть релятивные пути в вашем css-файле.

я решил это с помощью htaccess:

мои активы хранятся в src/Datacode/BudgetBundle/Resources/public|(css|img/js), а выходной параметр assetic настроен на запись в: bundles/datacodebudget/css / styles.УСБ (в каталоге)

в моем css я использую относительный путь ../ для ссылки на изображения.

здесь .правило htaccess файл:

# Make image path work on dev
# i.e. /app_dev.php/bundles/datacodebudget/img/glyphicons-halflings-white.png rewrites to /bundles/datacodebudget/img/glyphicons-halflings-white.png
RewriteRule ^app_dev\.php/(.*)/(.*)/img/(.*)$ ///img/ [L]

мой CSS загружается следующим образом:

{% stylesheets
    '@DatacodeBudgetBundle/Resources/public/css/bootstrap.css'
    '@DatacodeBudgetBundle/Resources/public/css/bootstrap-responsive.css'
    '@DatacodeBudgetBundle/Resources/public/css/styles.css' 
    '@DatacodeBudgetBundle/Resources/public/css/chosen.css' output="bundles/datacodebudget/css/styles.css"
%}
<link href="{{ asset_url }}" rel="stylesheet" type="text/css" />
{% endstylesheets %}

В моей конфигурации.yml-файл i есть:

assetic:
    use_controller: true

который (без перезаписи htaccess) заставляет изображения не загружаться, так как относительный путь для изображения находится в app_dev.php / bundles/datacodebudget/img / someimage.формат jpg. Использование фильтра cssrewrite также не работает, потому что затем он перезаписывается ../ img to ../../../../Ресурсов/государственной/ИМГ/ который возвращает ресурсы/общественные/ИМГ.

С помощью метода htaccess изображения загружаются нормально, и мне нужно только запустить assetic:dump / assets:install при добавлении новых изображений или хотите подтолкнуть изменения к производству.

Я решил эту проблему, постоянно создавая папку "images" с изображениями внутри в папке " symfony_root/web/". Результат: 'symfony_root/web/ images /' - И это становится отличной работой!

У меня похожая проблема, и я огляделся по крайней мере один день, и я не уверен, что есть хорошее практическое решение этой проблемы. Я рекомендую использовать Assetic для обработки javascript и css, а затем просто помещать ваши изображения в docroot вашего веб-сайта. Например, если у вас есть CSS-файл, который ссылается ../изображения/файл.png, просто создайте папку и изображения под вашим docroot и поместите файл.в ПНГ есть. Это определенно не лучшее теоретическое решение, но это единственное один я мог найти, что на самом деле работает.

Я "решил" это, загрузив файл css по-другому:

<link rel="stylesheet" href="{{ asset('bundles/cmtcore/css/main.css') }}" type="text/css" media="all" />

Это так, как это сделали в Acme/DemoBundle.

Я оставлю этот вопрос нерешенным, потому что это выглядит глупо.

Comments

    Ничего не найдено.