Как включить CSS файл в Symfony 2 и Twig?


я играю с Symfony2 и у меня есть проблемы, в том числе CSS и JS файлы веточка шаблон.

у меня есть пакет с именем Webs/HomeBundle внутри которого я HomeController С indexAction это делает файл шаблона ветки:

public function indexAction()
{
    return $this->render("WebsHomeBundle:Home:index.html.twig");
}

так что это легко. Теперь то, что я хочу сделать, это включить некоторые CSS и JS файлы внутри этого шаблона ветки. Шаблон выглядит так это:

<!DOCTYPE html>
<html>
<head>  
    {% block stylesheets %}
        <link href="{{ asset('css/main.css') }}" type="text/css" rel="stylesheet" />
    {% endblock %}
</head>
<body>
</body>
</html>

файл, который я хотел бы включить, main.css файл находится в:

Webs/HomeController/Resources/public/css/main.css

Итак, мой вопрос в основном, как, черт возьми, я могу включить простой файл CSS внутри шаблона Twig?

я использую веточку asset() функция, и она просто не попадает в правильный путь CSS. Кроме того, я запускаю эту команду в консоли:

app/console assets:install web

это создало новую папку

/web/bundles/webshome/...

это просто ссылка на элемент

src/Webs/HomeController/Resources/public/

верно?

вопросы

  1. где вы размещаете свой актив файлы, JS, CSS и изображения? Это нормально, чтобы положить их в ? Это подходящее место для них?
  2. как вы включаете эти актив файлы в вашем шаблоне Twig с помощью функции asset? Если они находятся в общей папке, как я могу их включить?
  3. должен ли я настроить что-то еще?
3 60

3 ответа:

Вы делаете все правильно, за исключением прохождения вашего пути к пакету .

по данным документация - в вашем примере это должно выглядеть, как показано ниже:

{{ asset('bundles/webshome/css/main.css') }}

Совет: вы также можете вызвать assets: install with --symlink ключ, поэтому он будет создавать символические ссылки в веб-папке. Это очень полезно, когда вы часто применяете js или css изменения (таким образом, ваши изменения, примененные к src/YouBundle/Resources/public будет сразу отражается в web папка без необходимости вызова assets:install снова):

app/console assets:install web --symlink

также, если вы хотите добавить некоторые активы в вашем дочернем шаблоне, вы можете позвонить parent() метод для блока ветки. В вашем случае это было бы так:

{% block stylesheets %}
    {{ parent() }}

    <link href="{{ asset('bundles/webshome/css/main.css') }}" rel="stylesheet">
{% endblock %}

и вы можете использовать %stylesheets% (assetic feature) тег:

{% stylesheets
    "@MainBundle/Resources/public/colorbox/colorbox.css"
    "%kerner.root_dir%/Resources/css/main.css"
%}
<link type="text/css" rel="stylesheet" media="all" href="{{ asset_url }}" />
{% endstylesheets %}

вы можете записать путь к css в качестве параметра (%parameter_name%).

подробнее об этом варианте:http://symfony.com/doc/current/cookbook/assetic/asset_management.html

остальные ответы действительны, но Официальные Рекомендации Symfony руководство предлагает использовать web/ папка для хранения всех активов, а не d