Не удается заставить CSS работать на Heroku с помощью Rails 4 с bootstrap-Sass gem

я развернул приложение для Heroku с одной проблемой, которую я не могу понять. CSS для приложения через Bootstrap-sass не загрузить так у меня стилевыми приложение. На данный момент это просто набор статических страниц.

я следовал всем, кроме одного шага в README https://github.com/thomas-mcdonald/bootstrap-sass шаг, который я не могу понять и, скорее всего, будет моей проблемой, выглядит следующим образом. Из-за изменения рельсов, которое предотвращает появление изображений скомпилированный в vendor и lib, вам нужно добавить следующую строку в свое приложение.rb:

config.assets.precompile += %w(*.png *.jpg *.jpeg *.gif)

поскольку я все еще очень новичок в программировании, первая проблема заключается в том, что я понятия не имею, где и как добавить это в приложение.файл rb. Я был бы очень признателен, если бы кто-нибудь помог мне показать, как и где правильно добавить вышеуказанную строку кода.

вторая проблема может быть связана с драгоценными камнями, которые я использую, однако, когда я создал приложение, драгоценный камень Sass-rails был установлен с ~> 4.0.0.бета1. Согласно README версия для использования 3.2. Поскольку это также может быть проблемой, я включил файл gem в случае, если кто-то определит, что является основной причиной моей проблемы.

заранее спасибо за любую помощь вы можете предоставить.

Edit: чтобы добавить шаги, которые я предпринял с первой попытки, которые привели к правильной работе стиля на моем локальном хосте, но не после развертывания кода в heroku.

  1. создал новую rails 4 app (файл gem ниже)
  2. добавлен Bootstrap-Sass gem, указанный в файле gem ниже
  3. добавлен PG gem в мой файл gem в производственной группе и перемещен SQLite3 в development and test (ran bundle install-без производства после шагов 2 и 3)
  4. создал контроллер страниц для статической главной страницы
  5. добавлен h1 внутри героя-блока на домашней странице, чтобы увидеть, работает ли стиль
  6. добавил стили.стиль CSS.SCSS файл и включен @import 'bootstrap'; в таблицу стилей
  7. создал репозиторий git, запустил мою начальную фиксацию и нажал код на git
  8. создал приложение heroku и подтолкнул мастера к heroku

со второй попытки я добавил навигационную панель на домашнюю страницу (если это имеет значение для кого-либо) и снова выполнил шаги 7 и 8, но перед выполнением этих шагов я запустил следующую строку кода.

RAILS_ENV=production bundle exec rake assets:precompile

Я все равно закончил с сайтом у этого был правильный стиль на моем местном Хосте, но никакой стиль не работал на Heroku. Как я уже отмечал выше в своем исходном посте, есть строка кода, которая должна быть добавлена в приложение.RB файл, который я не следовал из-за моего отсутствия понимания, как правильно добавить строку кода в файл.

Gemfile:

source 'https://rubygems.org'

ruby "2.0.0"

# Bundle edge Rails instead: gem 'rails', github: 'rails/rails'
gem 'rails', '4.0.0.beta1'

group :production do
gem 'pg'
end

group :development, :test do
gem 'sqlite3'
end

# Gems used only for assets and not required
# in production environments by default.
group :assets do
gem 'sass-rails',   '~> 4.0.0.beta1'
gem 'coffee-rails', '~> 4.0.0.beta1'

gem 'bootstrap-sass', '~> 2.3.1.1'

# See https://github.com/sstephenson/execjs#readme for more supported runtimes
# gem 'therubyracer', platforms: :ruby

gem 'uglifier', '>= 1.0.3'
end

gem 'jquery-rails'

# Turbolinks makes following links in your web application faster. Read more:  https://github.com/rails/turbolinks
gem 'turbolinks'

# Build JSON APIs with ease. Read more: https://github.com/rails/jbuilder
gem 'jbuilder', '~> 1.0.1'

# To use ActiveModel has_secure_password
# gem 'bcrypt-ruby', '~> 3.0.0'

# Use unicorn as the app server
# gem 'unicorn'

# Deploy with Capistrano
# gem 'capistrano', group: :development

# To use debugger
# gem 'debugger'

8 ответов


Я только что (июнь 13 2013)получил этот ответ от разработчиков Heroku, чья поддержка провела меня через барьеры. Вот как я получил свой css-дисплей от localhost, работающего в моем приложении Heroku.

" все, что вам нужно сделать, это включить обслуживание активов в производстве и установить лесоруб в stdout, чтобы заставить Rails4 работать на Heroku. В настоящее время мы работаем над сглаживанием процесса развертывания для приложений Rails 4, но пока вы можете просто изменить эти строки в своем коде, и они вам не понадобятся драгоценные камни."(Спасибо Брет и Нейл отличные новости)

In / config / environments / production. set:

config.cache_classes = true
config.serve_static_files = true
config.assets.compile = true
config.assets.digest = true

Я не знаю о stdout в logger, поэтому не могу проверить это.

сделать git добавить . и git commit.

убедитесь, что /config / database.yml имеет:

production:
  adapter: postgresql
  encoding: unicode
  database: Your_appname_production

вам понадобится эта информация для команды env ниже.

убедитесь, что у вас есть gem ' pg ' в производстве в вашем Gemfile Сделайте еще один git commit.

запустить команда в терминале в вашем приложении в одной строке:

env RAILS_ENV=production DATABASE_URL=postgresql://user:pass@127.0.0.1/Your_app_name_production bundle exec rake assets:precompile 2>&1

где DATABASE_URL=postgresql идентичен вашему производственному адаптеру в файле yml и Your_app_name_production указан, потому что Heroku, похоже, только запускает производство.

мне не советовали и не нужно было:

group :production do
  gem 'rails_log_stdout',           github: 'heroku/rails_log_stdout'
  gem 'rails3_serve_static_assets', github: 'heroku/rails3_serve_static_assets'
end

это ошибки в bundle install и Heroku.

не знаю, помогает ли это, но я также добавил производство в

Bundler.require(*Rails.groups(assets: %w(development test production)))

не могу вспомнить, где я видел этот совет.

HTH Арель!--6-->


просто запустить bundle exec rake assets:precompile прежде чем нажать на heroku


я смог исправить эту проблему, добавив эти два драгоценных камня в мое приложение

group :production do
  gem 'rails_log_stdout',           github: 'heroku/rails_log_stdout'
  gem 'rails3_serve_static_assets', github: 'heroku/rails3_serve_static_assets'
end

добавить, что работать bundle install а затем нажмите на heroku.

ваши стили должны начать погрузку.


прежде всего обновление с Rails beta до последняя версия.

проверьте, где вы могли бы установить config.assets.initialize_on_precompile = false поскольку это может заставить его вернуться к разрешению активов без звездочек (я предполагаю, что вы, возможно, установили его в false при чтении о Rails 3.x на heroku docs).

установить по умолчанию true

ruby config.assets.initialize_on_precompile = true

потом включить user-env-compile для приложения на в Heroku:

# Enable precompile support for the app
heroku labs:enable user-env-compile
# Remove precompiled assets
rm -rf public/assets/
git add -u 
git commit -m 'Remove precompiled assets'
# Now push and everything should just work from now on
git push heroku master

адаптировано из это bootstrap-Sass вопрос комментарий.


Set config.assets.compile=true в файле /config/environments/production.rb:

config.assets.compile=true

Нажмите здесь, чтобы узнать подробнее о конвейере активов.


config.cache_classes = true
config.serve_static_assets = true
config.assets.compile = true
config.assets.digest = true

установка их в config/envirnoments / production.rb исправил аналогичную проблему для меня с Apache server


Я бы не поставил config.assets.compile = true это имеет последствия для производительности (но это работает).

как описано здесь: https://stackoverflow.com/a/16882028/647427

When using the asset pipeline, paths to assets must be re-written and sass-rails provides -url and -path helpers (hyphenated in Sass, underscored in Ruby) for the following asset classes: image, font, video, audio, JavaScript and stylesheet.

image-url("rails.png") becomes url(/assets/rails.png)
image-path("rails.png") becomes "/assets/rails.png"
The more generic form can also be used but the asset path and class must both be specified:

asset-url("rails.png", image) becomes url(/assets/rails.png)
asset-path("rails.png", image) becomes "/assets/rails.png"

простой причиной этой героической проблемы может быть смешивание типов файлов css. По моему собственному опыту, это происходит, если вы выталкиваете папку assets, содержащую оба .css и .СКС типов файлов. Может, кто-то другой объяснит, почему это происходит...но все, что мне потребовалось, это переименовать .css файл(ы) to .scss. Тогда все было составлено правильно и все было правильно в мире.