Les bonnes pratiques de l'architecture des assets sous Symfony2

Bonjour.

Cela fait déjà quelques mois que je travaille sous Symfony2 avec un doute qui persiste : l'architecture de mes assets et leur organisation.
Après avoir lu et relu la doc sur l'utilisation d'assetic et des assets, j'aimerais comprendre quelles sont les bonnes pratiques.

Je vais vous expliquer ici comment je travaille et ce que j'ai compris.

Déjà, au niveau de l'architecture des Bundles, j'utilise un CoreBundle, puis tous les autres bundles de mon projet.
Pièce jointe 185111

Nous avons l'organisation classique au niveau des fichiers sources, ceux dans lesquels nous travaillons :
src >
namespace >
NomBundle >
Ressources >
config
public
views
Et c'est dans le public de chaque Bundle que se trouvent les assets, à savoir les images - fonts - css - js - librairies & cie.

Puis tous ces fichiers se trouvent directement copiés dans leur vrai chemin public que nous ne devons pas modifier, c'est à dire dans :
Pièce jointe 185113

Les bundles vendor et ceux que nous avons créés se trouvent donc bien là.
Ainsi, on retrouve les assets dans ce chemin public : bundles/nombundle/

C'est bien une copie de ce que nous avons dans nos fichiers sources de chaque bundle.

Dernière étape, il faut copier ces assets, grâce à assetic dans le répertoire web/public/ puisqu'ils faut qu'ils puissent être accessible partout.

Pour les images et css :
Pièce jointe 185114

Pour les javascript :
Pièce jointe 185116

Ainsi, tous les assets sont bien recopiés là où il faut dans :
Pièce jointe 185117

Et là c'est le début des problèmes. Selon moi, j'utilise les bonnes pratiques et je respecte la doc et la hierarchie au niveau de mes bundles.

Mais comme vous pouvez le voir sur la capture précédente :
- Les images ne sont pas copiées (le dossier images se crée mais un document 2edbc7b se crée) donc elles n'apparaissent pas sur le site
- Les css générés par less sont correctement générés et là aucun problème
- Les polices sont générées mais avec des fichiers .css style Nomdelapolice-regular.css et n'apparaissent donc pas sur le site.


J'aurais besoin d'aide la dessus, il y a quelque chose qui m'échappe ou que je n'ai pas bien compris même ayant lu la doc et pas mal de sujets/problèmes sur les assets.

Comment générer les images et les polices correctement ?

Alors attention, on parle ici d'assetic, et non des assets.
Les assets sont juste l'étape de copie des fichiers src/ et vendor/ vers web/bundle.
Assetic est l'executeur des taches de minifications, concatenation, etc... des fichiers web.


As tu un bout de code où vous intégrez les polices? assetic de devrait pas avoir à la gérer normalement.
Du coup je pense que tu suis les bonnes pratiques pour les css et les js. Mais pour les images et les fonts, ils ne devraient pas être traités par assetic et donc, ne devraient pas être mis dans compiled

Oui en effet je faisais une confusion de vocabulaire, merci.

Alors j'ai trouvé une manière qui respecte cette hiérarchie de copier correctement les images et les fonts.

Dans le fichier app/conf.yml, j'importe un fichier assets.yml dans lequel j'indique la configuration d'assetic ET j'indique la source et la destination des images et des fonts.
Pièce jointe 185144
Pièce jointe 185145
Tout se copie correctement dans le répertoire web. J'ai donc tous les assets (font et images compris qui sont là où ils doivent être :
Pièce jointe 185146

Maintenant, je n'ai plus aucun problème et pas d'erreur dans la console. Sauf que les polices sont chargées mais pas visibles sur le visuel.

JE les appelle dans mon style.less :
Pièce jointe 185147

Ok étant donné que tout se chargeait correctement, que les fichiers étaient copiés là où il fallait dans web/fichier/assets, j'ai fini par comprendre que c'était le fichier de base de la police qui ne fonctionnait pas !

ça m'a permis de structurer correctement toute l'architecture des assets. Maintenant EVERYTHING is working !

Le fait de poser le problème ici m'a permis de le résoudre. Merci gototog d'y avoir contribué.

Je pense que ça aidera pas mal de gens parce que la doc est peu explicite je trouve.

A Bientôt pe !

En tout cas bravo, c'est une implémentation très propre!

Sache que si un jour tu veux passer à la vitesse supérieure, regarde du coté de grunt, (ou gulp)
C'est un exécuteur de tache comme assetic, mais qui te permet d'avoir des fonctions plus élaborées.

Voici les avancées que j'ai constaté:
- Tu peux lancer les transformations qui te plaisent (minifie moi seulement les fichier du bundle Acme, fait moi seulement les traitements sur les fichiers less etc...)
- Il te permet de réactualiser la page de ton navigateur automatiquement a chaque modification css/js
- Et surtout, il ne va rien chercher/générer dans le cache symfony2, ce qui fait gagner beaucoup de temps sur les gros projets.


Après je dis ca pour information, j'ai ne suis pas un de leur actionnaire hin :]