Rotaie 3.1 e risorse immagine

156

Ho inserito tutte le mie immagini per il mio tema di amministrazione nella cartella delle risorse all'interno di una cartella chiamata admin. Quindi mi collego ad esso come al solito.

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

FYI. Solo per il test non sto ancora utilizzando il tag asset_path poiché non ho compilato i miei asset.

Ok tutto bene fino a quando non ho deciso di aggiornare un'immagine. Ho sostituito alcuni colori ma al ricaricare la nuova immagine in stile non viene visualizzata. Se visualizzo l'immagine direttamente nel browser, mostra ancora la vecchia immagine. Andando oltre, ho distrutto la cartella delle immagini dell'amministratore. Ma non ha rotto nulla, tutte le immagini sono ancora visualizzate. E sì, ho cancellato la cache e ho provato su più browser.

È in corso una sorta di memorizzazione nella cache delle immagini? Questo è solo lo sviluppo locale che utilizza pow per servire le pagine.

Anche distruggendo l'intera cartella delle immagini, le immagini vengono ancora pubblicate.

Mi sto perdendo qualcosa?

ruby-on-rails ruby-on-rails-3

— sottovento
fonte

2

non è il caso di 3.1 che utilizza la pipeline delle risorse. Dovresti usare il comando rake assets: precompile che comprimerà quei file e li sposterà nel file pubblico

— Lee

2

Bene, spostarli nella cartella pubblica ha funzionato, il tutto un po 'strano dato che hanno funzionato bene, essendo servito dalla cartella delle risorse. Forse dovrò aspettare altri documenti su 3.1.

— Lee,

3

Capisco la tua frustrazione. Apparentemente i candidati al rilascio non vengono documentati molto bene.

— tybro0103,

1

Lasciateli nelle risorse, semplicemente non includere affatto un percorso di cartella. Vedi la mia risposta qui sotto.

— Andrew,

226

In 3.1 ti basta sbarazzarti della parte "immagini" del percorso. Quindi un'immagine in cui risiederà /assets/images/example.pngsarà effettivamente accessibile in una richiesta get a questo url -/assets/example.png

Poiché la assets/imagescartella viene generata insieme a una nuova app 3.1, questa è la convenzione che probabilmente vorranno farti seguire. Penso che sia dove image_taglo cercherò, ma non l'ho ancora provato.

Inoltre, durante il keynote di RailsConf, ricordo D2h che diceva che il public foldernon dovrebbe più contenere molto, principalmente solo pagine di errore e una favicon.

— Lee McAlilly
fonte

Sì, ho giocato con questa assegnazione e hanno un modo per andare per renderlo più facile. Sì, inserendoli nella mia cartella delle risorse funziona, ma è possibile utilizzare il tag delle risorse. Quindi sto aspettando di vedere quali ulteriori informazioni vengono fuori.

— Lee,

1

Grazie, mi ha aiutato molto anche io. Questo è il tipo di cose che mi stanno facendo impazzire come un tizio che cerca di imparare Rails proveniente da altri framework di sviluppo web.

— jn29098

6

e cosa accadrebbe se due cartelle diverse contenessero lo stesso nome file?

— Hady Elsahar,

6

Non dovrebbe essere DH2?

— Tiago Franco,

1

Non sono sicuro del perché abbiano dovuto cambiare qualcosa che già funzionava.

— Tastybrownies,

98

Ti consigliamo di modificare l'estensione del file css da .css.scssa .css.scss.erbe da fare:

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

Potrebbe essere necessario eseguire un "aggiornamento rapido" per visualizzare le modifiche. CMD + MAIUSC + R sui browser OSX.

In produzione, assicurati

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

accade al momento dell'implementazione.

— tybro0103
fonte

44

Ci sono nuovi helper di immagini in sass: image_url, image_path, ... Altri possono essere trovati qui: edgeguides.rubyonrails.org/asset_pipeline.html Non c'è più bisogno di usare erb come preprocessore

— Martin Wawrusch

1

Ho provato gli helper di sass-rails (image_url e image-url) in un file css.scss ma non sembra essere interpretato. Qualche idea?

— invaino,

2

I file scss generati sono nominati .css.scss per impostazione predefinita, non è ancora avvenuta alcuna cagata del letto

— Adrian Macneil,

2

Per qualche ragione image-url non ha funzionato per me, ma asset-url ('myimage.png', image) ha funzionato perfettamente. (Rotaie 3.1)

— Elad

1

Nel caso qualcuno si stia chiedendo di aggiornare da 3.0, puoi semplicemente rinominare i tuoi fogli di stile da .cssa .css.erb(dopo averli spostati in app/assetsper ottenere l'elaborazione erb senza problemi.

— William Denniss,

22

Per quello che vale, quando ho fatto questo ho scoperto che nessuna cartella dovrebbe essere inclusa nel percorso nel file CSS. Ad esempio, se l'ho fatto app/assets/images/example.pnge l'ho inserito nel mio file CSS ...

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

... poi in qualche modo funziona magicamente. Ho capito questo eseguendo il rake assets:precompilecompito, che succhia solo tutto fuori di tutti i percorsi di carico e discariche in una cartella cassetto spazzatura: public/assets. È ironico, IMO ...

In ogni caso, ciò significa che non è necessario inserire percorsi di cartelle, tutto nelle cartelle delle risorse finirà per vivere in un'unica enorme directory. Non è chiaro come questo sistema risolva i conflitti di nomi di file, potrebbe essere necessario fare attenzione a questo.

Un po 'frustrante non ci sono documenti migliori là fuori per questo grande cambiamento.

— Andrea
fonte

3

In caso di conflitti di denominazione, il primo percorso che appare nell'array config.assets.paths è il file scelto. Questo può essere evitato usando l' asset_path()helper e specificando la directory.

— Joseph Ravenwolfe,

6

Questo "funziona magicamente" perché il file css e le immagini sono nella stessa posizione. I riferimenti ai file CSS sono relativi alla posizione del file css.

— Bill Leeper,

La pipeline delle risorse può essere un po 'una scatola nera, specialmente per gli sviluppatori front-end, ma offre molte grandi funzionalità come non doversi preoccupare dei percorsi dei file e del busting automatico della cache.

— Miglia

16

In rails 4 ora puoi usare un css e sass helper image-url:

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

Se le tue immagini di sfondo non vengono visualizzate, considera il modo in cui le fai riferimento nei fogli di stile.

— lflores
fonte

1

Questo è corretto (per binari 4). Vota questa risposta!

— ahnbizcad,

Rails "ti aiuta" inserendo la parola chiave url e la stringa. Questo significa che puoi fare cose del genere. div.logo {background: image-url("logo.png") no-repeat center;}

— Antony Denyer,

10

quando si fa riferimento a immagini in CSS o in un tag IMG, utilizzare image-name.jpg

mentre l'immagine si trova davvero sotto ./assets/images/image-name.jpg

— Tilo
fonte

Penso che questo sia sbagliato quando si tratta di CSS - usando rails 3.1.0.rc4 quando lo uso background: url('sort_asc_disabled.png')funziona per il file app / assets / images / sort_asc_disabled.png.

— wonderfulthunk,

2

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

Questo railscast (video tutorial di Rails sulla pipeline di risorse) aiuta molto a spiegare anche i percorsi nella pipeline di risorse. L'ho trovato abbastanza utile e in realtà l'ho visto alcune volte.

La soluzione che ho scelto è @Lee McAlilly sopra, ma questo railscast mi ha aiutato a capire perché funziona. Spero che sia d'aiuto!

— botbot
fonte

0

La pipeline di risorse in rotaie offre un metodo per questa cosa esatta.

Aggiungi semplicemente image_path ('nome file immagine') al tuo file css o scss e rails si occupa di tutto. Per esempio:

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

(nota che funziona proprio come in una vista .erb e non usi "/ assets" o "/ assets / images" nel percorso)

Rails offre anche altri metodi di supporto e qui c'è un'altra risposta: come posso usare le immagini di riferimento in Sass quando uso Rails 3.1?

— benrugg
fonte

So che questa domanda ha un paio d'anni, ma questa è stata la prima pagina che ho trovato su Google durante la ricerca, quindi sarebbe fantastico selezionare una risposta in modo che altri possano facilmente fare riferimento a questa!

— Benrugg,