web-dev-qa-db-fra.com

Rails 3.1 et les ressources d'image

J'ai mis toutes mes images pour mon thème administrateur dans le dossier assets dans un dossier appelé admin. Ensuite, je me connecte comme d'habitude, c'est-à-dire.

# Ruby    
image_tag "admin/file.jpg" .....
#CSS
.logo{ background:url('/assets/images/admin/logo.png');

FYI. Juste pour tester je n'utilise pas encore la balise asset_path car je n'ai pas compilé mes actifs.

Ok tout va bien jusqu'à ce que j'ai décidé de mettre à jour une image. J'ai remplacé certaines couleurs mais lors du rechargement, la nouvelle image stylisée ne s'affiche pas. Si je visualise l'image directement dans le navigateur, elle affiche toujours l'ancienne image. Pour aller plus loin, j'ai détruit le dossier des images d'administration. Mais rien n'a été cassé, toutes les images sont toujours affichées. Et oui, j'ai effacé mon cache et essayé sur plusieurs navigateurs.

Existe-t-il une sorte de mise en cache des images? Ceci est juste le développement local en utilisant pow pour servir les pages.

Même en détruisant tout le dossier des images, les images sont toujours servies.

Est-ce que je manque quelque chose?

ruby-on-railsruby-on-rails-3
156
Lee

En 3.1, vous venez de vous débarrasser de la partie "images" du chemin. Ainsi, une image résidant dans /assets/images/example.png sera en réalité accessible dans une requête get de cette URL - /assets/example.png

Étant donné que le dossier assets/images est généré avec une nouvelle application 3.1, il s’agit de la convention qu’ils souhaitent probablement que vous suiviez. Je pense que c'est là que image_tag le cherchera, mais je ne l'ai pas encore testé.

De plus, pendant le discours de RailsConf, je me souviens que D2h avait déclaré que le public folder ne devrait plus contenir grand-chose, principalement des pages d'erreur et un favicon.

226
Lee McAlilly

Vous voudrez changer l'extension de votre fichier CSS de .css.scss en .css.scss.erb et faire:

background-image:url(<%=asset_path "admin/logo.png"%>);

Vous devrez peut-être effectuer une "actualisation matérielle" pour voir les modifications. CMD + SHIFT + R sur les navigateurs OSX.

En production, assurez-vous

rm -rf public/assets    
bundle exec rake assets:precompile Rails_ENV=production

arrive lors du déploiement.

98
tybro0103

Pour ce que ça vaut, quand j'ai fait ça, j'ai trouvé qu'aucun dossier ne devrait être inclus dans le chemin du fichier css. Par exemple, si j'ai app/assets/images/example.png et que je mets ceci dans mon fichier css ...

div.example { background: url('example.png'); }

... alors, d'une certaine manière, cela fonctionne comme par magie. J'ai compris cela en exécutant la tâche rake assets:precompile, qui aspire simplement tous les chemins de chargement et les vide dans un dossier du tiroir de courrier indésirable: public/assets. C'est ironique, IMO ...

Dans tous les cas, cela signifie que vous n’avez pas besoin de définir de chemin de dossier, tout ce qui se trouve dans vos dossiers de ressources finira par résider dans un immense répertoire. La façon dont ce système résout les conflits de noms de fichiers n’est pas claire, vous devrez peut-être faire attention à ce sujet.

C'est un peu frustrant, il n'y a pas de meilleurs médecins pour ce grand changement.

22
Andrew

Dans Rails 4, vous pouvez maintenant utiliser une image-url helper css and sass helper:

div.logo {background-image: image-url("logo.png");}

Si vos images de fond ne s'affichent pas, réfléchissez à la façon dont vous les référencez dans vos feuilles de style.

16
lflores

pour référencer des images en CSS ou dans une balise IMG, utilisez image-name.jpg

alors que l'image est vraiment située sous ./assets/images/image-name.jpg

10
Tilo

http://railscasts.com/episodes/279-understanding-the-asset-pipeline

Cette diffusion sur rail (vidéo du didacticiel Rails sur le pipeline d’actifs) aide également beaucoup à expliquer les chemins dans le pipeline d’actifs. Je l'ai trouvé très utile et je l'ai regardé plusieurs fois.

La solution que j'ai choisie est celle de @Lee McAlilly, mais cette diffusion sur rail m'a aidée à comprendre pourquoi cela fonctionne. J'espère que ça aide!

2
botbot

Le pipeline d'actifs dans Rails offre une méthode pour cette chose exacte.

Vous ajoutez simplement image_path à votre fichier css ou scss et Rails s’occupe de tout. Par exemple:

.logo{ background:url(image_path('admin/logo.png'));

(notez que cela fonctionne comme dans une vue .erb et que vous n'utilisez pas "/ assets" ou "/ assets/images" dans le chemin)

Rails propose également d'autres méthodes d'assistance, et il existe une autre réponse ici: Comment utiliser les images de référence dans Sass avec Rails 3.1?

0
benrugg