Rails 4 путь изображения, URL-адрес изображения и URL-адрес ресурса больше не работают в файлах SCSS

Предполагаем ли мы использовать что-то еще, кроме image-url и других в Rails 4? Они возвращают разные значения, которые, похоже, не имеют смысла. Если у меня есть logo.png в /app/assets/images/logo.png и я делаю следующее, это то, что я получаю:

 image-url("logo.png") -> url("/images/logo.png") #obviously doesn't work image-path("logo.png") -> "/images/logo.png" asset-url("logo.png") -> url("/logo.png") 

Конечно, ни одна из них не работает, потому что им нужно как минимум /assets впереди.

UPDATE : На самом деле, я только что заметил, как мне получить доступ к изображениям в Rails 4? У меня есть изображение на /app/assets/images/logo.png . Но если я перейду к любому из следующих URL-адресов, я до сих пор не вижу своего изображения:

 http://localhost:3000/assets/logo.png http://localhost:3000/assets/images/logo.png http://localhost:3000/logo.png http://localhost:3000/images/logo.png 

ОБНОВЛЕНИЕ 2 : Единственный способ, которым я могу поднять свой logo.png – это переместить его в каталог /app/assets/stylesheets а затем потянуть вверх:

 http://localhost:3000/assets/logo.png 

У меня просто была эта проблема. 3 балла, которые, надеюсь, помогут:

  • Если вы размещаете изображения в каталоге app/assets/images , вы должны иметь возможность напрямую вызвать изображение без префикса в пути. то есть. image_url('logo.png')
  • В зависимости от того, где вы используете актив, будет зависеть от метода. Если вы используете его как свойство background-image: то ваша строка кода должна быть background-image: image-url('logo.png') . Это работает как для таблиц стилей меньшего размера, так и для sass. Если вы используете его inline в представлении, вам нужно будет использовать встроенный помощник image_tag в рельсах для вывода вашего изображения. Еще раз, префикс <%= image_tag 'logo.png' %>
  • Наконец, если вы предварительно скомпилируете свои активы, запустите rake assets:precompile свои активы или rake assets:precompile RAILS_ENV=production для производства, иначе ваша производственная среда не будет иметь отпечатки пальцев при загрузке страницы.

Также для этих команд в пункте 3 вам нужно будет префикс их с помощью bundle exec если вы используете bundler.

Ваша первая формулировка, image_url('logo.png') , верна. Если изображение найдено, оно будет генерировать путь /assets/logo.png (плюс hash в процессе производства). Однако, если Rails не может найти изображение, которое вы назвали, оно вернется к /images/logo.png .

Следующий вопрос: почему Rails не находит ваш образ? Если вы поместите его в app / assets / images / logo.png, тогда вы сможете получить к нему доступ, перейдя по http://localhost:3000/assets/logo.png .

Если это работает, но ваш CSS не обновляется, вам может потребоваться очистить кеш. Удалите tmp/cache/assets из каталога проекта и перезапустите сервер (webrick и т. Д.).

Если это не удается, вы также можете попробовать просто использовать background-image: url(logo.png); Это заставит ваш CSS искать файлы с таким же относительным путем (что в данном случае является / assets).

У меня была аналогичная проблема, пытаясь добавить фоновое изображение с встроенным css. Не нужно указывать папку с изображениями из-за того, как работает синхронизация ресурсов.

Это сработало для меня:

 background-image: url('/assets/image.jpg'); 

Я только выяснил, что с помощью помощника asset_url вы решаете эту проблему.

 asset_url("backgrounds/pattern.png", image) 

Rails 4.0.0 будет выглядеть как изображение с image-url в той же структуре каталогов с вашим файлом css.

Например, если ваш css в assets/stylesheets/main.css.scss , image-url('logo.png') становится url(/assets/logo.png) .

Если вы переместите свой файл css в assets/stylesheets/cpanel/main.css.scss , image-url('logo.png') станет /assets/cpanel/logo.png .

Если вы хотите использовать изображение непосредственно в каталоге ресурсов / изображений, вы можете использовать asset-url('logo.png')

для stylesheets: url (asset_path (‘image.jpg’))

Interesting Posts

Попробуйте с ресурсами против Try-Catch

Горизонтальная прокрутка RecyclerView в центре

Печать через удаленный сервер CUPS, но просто покажите подмножество принтеров

Как переписать одну и ту же строку в командном выводе из командного файла

Центр обновления Windows уничтожает мое интернет-соединение

Зачем использовать TryCast вместо DirectCast?

Что является самым элегантным способом конвертировать дефисное слово (например, «делать что-то») в более низкое изменение верблюжьего случая (например, «doSomeStuff»)?

В чем разница между макросом и константой в C ++?

Эффективный алгоритм упорядочения объектов разных типов

Как создавать элементы управления динамически в MVC 3 на основе XML-файла

Как получить продолжительность видео с mp4, wmv, flv, mov videos

Запись объекта MemoryStream в ответ

Как устранить интерполирование внутри атрибутов было удалено. Использовать v-bind или сокращенную двоеточие? Vue.JS 2

Как я могу заставить TFS2010 запускать MSDEPLOY для меня через MSBUILD?

Открыть раскрывающийся список (в представлении данных) с одним щелчком мыши

Давайте будем гением компьютера.