Con Assetic / Twig / Symfony2, posso definire le librerie front-end?

Sto usando Symfony2, con Assetic e Twig. Ho varie librerie di frontend: Backbone, jQuery, jQuery UI e Bootstrap. Sia Bootstrap che l’interfaccia utente jQuery includono file CSS e JS.

C’è un modo per definire le risorse che devono includere (incluse le dipendenze), quindi in Twig / Assetic includere tutte quelle risorse in un unico tag? Quello che guarderei di avere è qualcosa di simile:

// config.yml  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 

Ho trovato un paio di domande correlate:

  • Come definire le risorse Assetic nel file di configurazione di yml o xml di Symfony 2?
  • Symfony2 Assetic + Twig Template JavaScript Ereditarietà

ma nessuno dei due sembra coinvolgere la definizione delle risorse in config.yml. Invece, li definiscono in base.html.twig ma è quello che sto cercando di evitare.

Ho provato a usare il tag use in Twig, definendo un template chiamato ‘jquery_ui’ e usando {% stylesheets %} e {% javascripts %} in quel blocco e poi in base.html.twig mettendo {% use "jquery-ui.html" %} . Tuttavia, l’ use non importa il modello perché ha un corpo.

Sebbene esista il supporto per la definizione delle librerie front-end, purtroppo non esiste alcun supporto per la risoluzione delle dipendenze. Devi anche definire separatamente CSS e JavaScript.

Quello che ho fatto, è creare un file separato in /app/config/ chiamato assets.yml e includerlo nella configurazione principale per mantenere le cose pulite.

 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' - ... 

Nota che ‘% kernel.root_dir%’ si risolve nella directory app di default in Symfony2. Ora puoi utilizzare le risorse nei tuoi modelli Twig.

 {% block javascripts %} {% javascripts '@jquery' '@my_lib' output="js/jquery.js" %}  {% endjavascripts %} {% endblock %} 

Lo stesso potrebbe essere fatto per i file CSS. L’esempio dimostra anche perché non è ansible definire CSS e JavaScript come una singola risorsa.

La soluzione più semplice è metterli nelle directory appropriate nella directory web / poiché questa è la radice del tuo sito che è servita per tutti i tuoi bundle Symfony.

È ansible controllare Cartero, che consente di definire “pacchetti di risorse”, incluse le dipendenze, e quindi includere tali pacchetti nella pagina.

https://github.com/rotundasoftware/cartero

Dovresti scrivere un hook Symfony2, ma non sarebbe troppo difficile.