SASS-rails auxiliaires « image-url », « bien-url » ne fonctionnent pas dans des rails 3.2.1
-
25-10-2019 - |
Question
Je suis sur 3.2.1, avec SASS-rails-3.2.4 et 3.1.15 SASS ...
La documentation pour le pipeline d'actifs dit:
asset-url("rails.png", image) becomes url(/assets/rails.png)
image-url("rails.png") becomes url(/assets/rails.png)
...
Je fait le fichier suivant:
# app/assets/stylesheets/public/omg.css.sass
body
background: asset-url('snake.gif', image)
#lol
background: image-url('snake.gif')
et quand je visite localhost: 3000 / actifs / public / omg.css je reçois:
body {
background: asset-url("snake.gif", image); }
#lol {
background: image-url("snake.gif"); }
... J'ai aussi essayé de changer le fichier à omg.css.scss et changé la syntaxe à:
# app/assets/stylesheets/public/omg.css.scss
body {
background: asset-url('snake.gif', image);
}
#lol {
background: image-url('snake.gif');
}
mais obtenir les mêmes résultats ... Quelqu'un at-il une idée pourquoi ces aides ne fonctionnent pas?
La solution
En dépit de ce que dit la documentation, il semble que les options par défaut dans les rails 3.2.6 vous permettent de simplement faire fonctionner les choses avec des informations de chemin encore moins dans votre CSS.
Par exemple. ../app/assets/images/rails.png
est des références dans votre fichier example.css.scss avec quelque chose comme:
background: white url(rails.png) repeat-y;
Vous ne comprennent pas le image-url
ou asset-url
dans votre SCSS (pour autant que je sache), juste url(your_image.png)
plaine. Ce peu de documentation semble être juste une explication de ce qu'il fait en arrière-plan.
Autres conseils
Quand je frappe ce problème, c'était parce que je ne l'avais pas inclus le fichier css dans le pipeline d'actifs pour le pré-compilation. En conséquence, il serait généré lors de l'exécution. Parce que les rails SASS-gemme est souvent dans le groupe: actifs, les aides ne sont pas disponibles lors de la génération des fichiers css lors de l'exécution
.Essayez d'ajouter la ligne suivante à votre application.rb (ou production.rb):
config.assets.precompile += %w( public/omg.css )
J'ai trouvé le correctif sur ce poste y compris une chasse aux sorcières autour de nommer les fichiers en les ajoutant à la precompiler.
Si vous avez mis à jour votre application Rails 3.1 dans le passé, assurez-vous que vous avez changé votre fichier application.rb de
# If you have a Gemfile, require the gems listed there, including any gems
# you've limited to :test, :development, or :production.
Bundler.require(:default, Rails.env) if defined?(Bundler)
à
if defined?(Bundler)
# If you precompile assets before deploying to production, use this line
Bundler.require *Rails.groups(:assets => %w(development test))
# If you want your assets lazily compiled in production, use this line
# Bundler.require(:default, :assets, Rails.env)
end
Voir cette Railscast sur la mise à niveau de Rails 3.1 et l'ajout du pipeline d'actifs.
Mise à jour: Rails 4 remonte à l'ancienne façon de le faire. Merci Aaron Gray
# Require the gems listed in Gemfile, including any gems
# you've limited to :test, :development, or :production.
Bundler.require(:default, Rails.env)
Avez-vous activé le pipeline d'actifs application.rb
?
config.assets.enabled = true
Vous avez droit en définissant l'extension de vos Sass à .css.scss
feuilles de style. Cela permet de Rails connaître pour analyser le fichier avec Sass d'abord avant qu'il émet le contenu en CSS.
Vous pouvez essayer d'effacer / tmp / cache. Je suis trop nouveau pour Rails et Sass savoir pourquoi cela a fonctionné, mais il résolu pour moi le même problème après les heures de recherche.
BTW, cela a fonctionné malgré le fait que je pouvais voir d'autres directives Sass, telles que la définition des variables et le calcul avec eux, en cours d'exécution. Je suis sûr qu'il ya une explication très simple, une fois que j'ai le temps de le suivre vers le bas.
J'ai fait le changement proposé par @Ryan, ainsi que des rails de SASS mise à niveau:
bundle update sass-rails
SASS 3.2.6 travaillé pour moi, alors que 3.2.5 ne l'ont pas.
Nous avons juste eu le même problème et fixé en exigeant explicitement Pignons dans le Gemfile (même si elle est une dépendance de ActionPack):
group :assets do
gem 'sprockets'
gem 'sass-rails', '~> 3.2.3'
# ...
end
Je ne sais pas pourquoi, mais ça fonctionne maintenant. ; -)
J'ai été cogne la tête contre ce pendant plusieurs jours. La seule solution qui a fonctionné pour moi a été comme suit:
- Assurez-vous SASS-rails à votre: groupe de développement dans votre Gemfile.
-
Si cela ne résout pas, ajoutez ce qui suit dans un nouveau fichier dans config / initializers / appelé quelque chose comme « horrible_sass_patch.rb »:
begin require 'sass-rails' rescue end if Class.const_defined? "Sass::Script::Functions" module Sass::Script::Functions # This function exists, but doesn't automatically register declare :asset_url, [:value] declare :image_url, [:value] declare :font_url, [:value] # ... etc end end
Note: Il faut donc que vous utilisez le « actif » mécanisme de chargement Bundler, à savoir votre application.rb utilise ce qui suit:
Bundler.require *Rails.groups(:assets => %w(development test))
... et si vos feuilles de style sont vendeur, assurez-vous qu'ils sont inclus dans la configuration de Sass:
if config.respond_to? :sass
config.sass.load_paths << Rails.root.join('vendor', 'assets', 'stylesheets')
end
Vous pouvez simplement ajouter une barre oblique arrière /
sur le chemin et l'utilisation url
comme vous le faites habituellement.
background-image: url("/assets/rails.png")