使用Assetic/Twig/Symfony2,我可以定义前端库吗？

Question

我正在使用Symfony2,Assetic和Twig.我有各种前端库 - Backbone,jQuery,jQuery UI和Bootstrap.Bootstrap和jQuery UI都包含CSS和JS文件.

有没有办法可以定义他们需要包含的资源(包括依赖项),然后在Twig/Assetic中将所有这些资源包含在一个标签中？我希望看到的是:

// config.yml <!-- DOES NOT WORK -->
assetic:
  resources:
    jquery:
      js: /filepath/to/jquery.js
    jquery_ui:
      dependencies: jquery
      css: /filepath/to/jqueryui.css
      js: /filepath/to/jqueryui.js
    less:
      js: /filepath/to/less.js
    bootstrap:
      dependencies: { less, jquery }
      js: /filepath/to/bootstrap.js
      css: /filepath/to/bootstrap.css
    backbone:
      dependencies: { jquery }
      js: { /filepath/to/underscore.js, /filepath/to/backbone.js }

// view.html.twig
{% use jquery_ui %}
{% use bootstrap %} 

// outputs all js and css for jQuery, jQueryUI, Less, Backbone, and Bootstrap

我发现了几个相关的问题:

• 如何在Symfony 2 yml或xml配置文件中定义Assetic资源？
• Symfony2 Assetic + Twig模板JavaScript继承

但似乎都没有涉及在config.yml中定义资源.相反,他们定义了它们,base.html.twig但这正是我想要避免的.

我尝试use在Twig中使用标签,通过定义一个名为'jquery_ui'的模板{% stylesheets %}并{% javascripts %}在该块中使用and然后在base.html.twigput中使用{% use "jquery-ui.html" %}.但是,use不会导入模板,因为它有一个正文.

Answer 1

虽然确实支持定义前端库,但遗憾的是不支持依赖解析.您还必须单独定义CSS和JavaScript.

我一直在做的是在/app/config/被调用中创建一个单独的文件,assets.yml并将其包含在主配置中以保持干净.

assetic:
    assets:
        jquery:
            inputs:
                - '%kernel.root_dir%/Resources/public/js/jquery.js'
                - '%kernel.root_dir%/Resources/public/js/jquery-ui.js'
        my_lib:
            inputs:
                - '%kernel.root_dir%/Resources/public/js/my-custom-lib.js'
                - ...

请注意,'%kernel.root_dir%' app默认解析为Symfony2中的目录.您现在可以在Twig模板中使用资产.

{% block javascripts %}
    {% javascripts '@jquery' '@my_lib' output="js/jquery.js" %}
        <script type="text/javascript" src="{{ asset_url }}"></script>
    {% endjavascripts %}
{% endblock %}

CSS文件也可以这样做.该示例还演示了为什么不可能将CSS和JavaScript定义为单个资产.