CODEWITHSUNDEEP
phpexceptiontwigsymfony-2.1assetic
Major Productions
Major Productions

Reputation: 6062

Symfony 2.1 - problems loading assets and an exception thrown by assetic

This is a bit frustrating. According to Symfony best practices, a bundle's web assets (images, css, js) should be placed in src/vendor/path/to/bundle/Resources/public. Running app/console assets:install copies the contents of that public folder to web/bundles/bundlename. In the official documentation, Twig templates are shown to grab these assets with code like:

{% block stylesheets %}
    <link rel="stylesheet" type="text/css" href="{{ asset('/css/styles.css') }}
{% endblock %}

When I try it, instead of magically grabbing my assets from web/bundles/bundlename/css/styles.css, it instead just goes for web/css/styles.css. Is this expected behavior? The official documentation is less than clear about this.

In order to try to combat this issue, I tried embracing assetic's ability to dynamically serve assets. I tried:

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

But got the following exception:

An exception has been thrown during the compilation of a template ("You must add mybundle to the assetic.bundle config to use the {% stylesheets %} tag in mybundle:Home:index.html.twig.") in "/home/kevin/www/src/mybundle/Resources/views/Home/index.html.twig

The official Symfony documentation makes it appear that it should work out of the box with no configuration necessary.

So, TLDR:

  1. Am I not understanding how assets should be loaded?
  2. How do I address the assetic exception?

Upvotes: 1

Views: 4921

Answers (1)

lifo
lifo

Reputation: 2893

To fix the assetic exception you need to configure your bundle in your config.yml like this:

assetic:
    bundles: [ MyAwesomeBundle ]

The {{ asset(...) }} twig function will serve files relative from your web root.

You use app/console assets:install to install static assets within your web root and you can later easily point to them using the asset function like this {{ asset('/mybundle/css/site.css') }}

Upvotes: 5

Related Questions