web-dev-qa-db-fra.com

Comment utiliser CSS avec une application Ruby on Rails?

Comment utiliser CSS avec RoR? Lorsque je crée un lien externe, je ne peux jamais voir les fichiers. J'ai copié le fichier .css dans tous les dossiers auxquels je pouvais penser ... vues, contrôleur, modèle et rien ne semble fonctionner.

Que dois-je faire pour activer les fichiers CSS externes avec une application Rails? Je suis nouveau dans Rails, alors pardonnez-moi si c'est basique.

ruby-on-railscssruby
59
Stefan Kendall

Mettez les fichiers CSS dans des feuilles de style publiques et utilisez ensuite:

<%= stylesheet_link_tag "filename" %>

pour créer un lien vers la feuille de style dans vos présentations ou les fichiers erb dans vos vues.

De même, vous mettez des images dans public/images et des fichiers javascript dans public/javascripts.

56
Kyle Boon

Si vous utilisez la version Rails> 3, alors il existe un concept appelé asset pipeline. Vous pouvez ajouter votre CSS à

app/assets/stylesheets

puis il sera automatiquement récupéré par l'application. (ceci est utile car Rails compressera automatiquement les fichiers CSS)

en savoir plus ici sur le pipeline d'actifs

18
sameera207

J'ai fait ce qui suit ...

  1. placez votre fichier css dans le app/assets/stylesheets dossier.
  2. Ajoutez le lien de la feuille de style <%= stylesheet_link_tag "filename" %> dans votre fichier de mise en page par défaut (très probablement application.html.erb)

Je le recommande plutôt que d'utiliser votre dossier public. Vous pouvez également référencer la feuille de style en ligne, comme dans votre page d'index.

14
Jim Chertkov

Utilisez la balise de feuille de style Rails pour lier votre main.css comme ceci

<%= stylesheet_link_tag "main" %>

Aller à

config/initializers/assets.rb

Une fois à l'intérieur du assets.rb ajoutez l'extrait de code suivant juste en dessous de Rails.application.config.assets.version = '1.0'

Rails.application.config.assets.version = '1.0'
Rails.application.config.assets.precompile += %w( main.css )

Redémarrez votre serveur.

13
Sparta Newton Robert

Le message d'origine pourrait avoir été vrai en 2009, mais maintenant il est en fait incorrect maintenant, et aucun lien n'est même requis pour la feuille de style comme je le mentionne dans certaines des autres réponses. Rails le fera désormais pour vous par défaut.

  • Placez toute nouvelle feuille .css (ou autre) dans l'application/les actifs/les feuilles de style
  • Testez votre serveur avec Rails-root/scripts/Rails server et vous verrez que le lien est ajouté par Rails lui-même.

Vous pouvez tester cela avec un chemin dans votre navigateur comme testserverpath: 3000/assets/filename_to_test.css? Body = 1

3
CodeJohnny

Pour ajouter à ce qui précède, l'endroit le plus évident pour ajouter stylesheet_link_tag est dans la mise en page de votre application globale - application.html.erb.

2
Raphomet

Avez-vous essayé de le mettre dans votre dossier public? Chaque fois que j'ai des images ou similaires que je dois référencer en externe, je les mets tout là-bas.

0
Chris Bunch