Rails 3.2 Asset Pipeline + Custom Theme + Bootstrap

Question

Надеюсь, кто-то может мне помочь, поскольку я схожу с ума, читая/пытаясь все, чтобы мои загружаемые в CSS файлы CSS, но они либо не показывают, либо я получаю ошибку 404.

My 3.2 RoR приложение использует смесь купленной темы и загрузочного лота. Конечно, все отлично выглядит в dev, но как только я нажимаю на производство, ничего не работает правильно.

Кроме того, у меня есть 2 макета, application.html.erb и homepage.html.erb. Application.html.erb вызывает дополнительный CSS, как описано ниже.

У меня есть следующие в моем каталоге приложения/активов/Стилей:

stylesheets 
+compiled 
--theme.css #references bootstrap/bootstrap.min.css 
--custom_theme.css #additional CSS used in application.html.erb 
+vendor 
--animate.css 
--brankic.css 
+bootstrap 
--bootstrap.min.css 
application.css 
inbox.css 

В моей application.html.erb макете я явно вызывать следующий CSS:

<%= stylesheet_link_tag 'compiled/theme.css', 'vendor/brankic.css', 'vendor/animate.css', 'compiled/custom_theme.css', 'inbox.css' %> 

В домашней странице. html.erb layout Я прямо называю следующий CSS:

<%= stylesheet_link_tag 'compiled/theme.css', 'vendor/brankic.css', 'vendor/animate.css', 'inbox.css' %> 

Я попытался использовать application.cs s, с * = require_tree. но это тогда тянет во всем, и с макета домашней страницы мне не нужен custom_theme. Если я создаю домашнюю страницу.css и опускаю custom_theme, мне все равно нужно добавить * = require_tree. поскольку в файле theme.css есть ссылки на другие файлы в каталоге.

Наконец, я попытался явно предварительно скомпилировать CSS в файле config/env/prod, но это не приведет к ссылкам css-файлов.

EDIT

предложение Per Майк, я добавил следующее к моей конфигурации/ENV/файла прод:

config.assets.precompile += ['bootstrap/bootstrap.min.css','compiled/theme.css', 'vendor/brankic.css', 'vendor/animate.css', 'se2b_custom.css', 'inbox.css'] 

Я до сих пор непосредственно вызывающему каждый CSS, как описано выше, и все еще получая ошибку 404 в производстве для каждого.

Просмотр источника страницы с помощью моего макета домашней страницы, это то, что показано на рисунке:

<link href="/assets/bootstrap/bootstrap.min.css?body=1" media="screen" rel="stylesheet" type="text/css" /> 
<link href="/assets/compiled/theme.css?body=1" media="screen" rel="stylesheet" type="text/css" /> 
<link href="/assets/vendor/brankic.css?body=1" media="screen" rel="stylesheet" type="text/css" /> 
<link href="/assets/vendor/animate.css?body=1" media="screen" rel="stylesheet" type="text/css" /> 
<link href="/assets/inbox.css?body=1" media="screen" rel="stylesheet" type="text/css" /> 

нажав на результаты ссылок в 404.

Answer 1

Вы должны убедиться, что все файлы CSS вы не включая в вашем application.css манифеста помещаются в ваш список config.assets.precompile в конфигурации/сред/production.rb:

config.assets.precompile += [ 'compiled/theme.css', 'vendor/brankic.css', 'vendor/animate.css', 'compiled/custom_theme.css', 'inbox.css'] 

Это позволяет ваш г ails app знает, какие активы должным образом минимизируют, угадают и препроцессор в соответствующие файлы для производства. Вы можете прочитать больше о том, как удивительным рельсы/Звездочки является при выполнении активов автоматизации предварительной компиляции для вас here

EDIT В ответ на ваш комментарий:

Вам нужно только включить активы (JS/кофе/CSS/СКС) в вашем config.assets.прекомпиляционный массив, который не, включенный в вашу декларацию приложения и, вы планируете ссылаться в своем html/другом месте. Rails является большим о doc'ing важных примечаний в автогенерируемых файлы, и он говорит, что в конфигурации/средах/production.rb:

# Precompile additional assets (application.js, application.css, and all non-JS/CSS are already added) 
    config.assets.precompile += %w(compiled/theme.css, vendor/brankic.css, path/to/other_manifest, ....) 

Важная частью является application.js, application.css, и все без JS/CSS уже добавлены, что означает, что если вам нужно сделать:

<%= stylesheet_link_tag "compiled/theme.css" %> 

ИЛИ

<%= javascript_include_tag "a_different/javascript_file.js" %> 

Тогда вы должны позволить рельсы знать, предварительно скомпилируйте их в свои собственные файлы личных ресурсов, добавив их в массив config.assets.precompile. Я знаю, это может показаться запутанным, но целью обслуживания производственных активов является объединение файлов автоматически в качестве минимально возможного количества файлов и Минимизировать/уродовать/и т.д., чтобы помочь:

1. минимизировать общие размеры файлов обслуживаются.
2. свести к минимуму количество ненужных запросов на ваш сервер для нескольких файлов активов.
3. ревизия для облегчения перебора кэша.

Если вам нужно более подробное объяснение, дайте мне знать! В противном случае считайте это принятым ответом.

Что касается шрифтов, вот что я делаю:

1. создать приложение каталог/активы/шрифты, и поместить все файлы шрифтов в там.
2. создать/повторное использование файла CSS в приложение/активов/стилей и ссылки на шрифты соответственно

, например (приложение/активы/таблицы стилей/styles.css):

@font-face { 
    font-family: "CoolIcons"; 
    // I have put my fonts in app/assets/fonts/cool-icons directory 
    src: font-url("cool-icons/cool-icon.eot"); 
    src: font-url("cool-icons/cool-icon.eot#iefix") format("embedded-opentype"), 
    font-url("cool-icons/cool-icon.woff") format("woff"), 
    font-url("cool-icons/cool-icon.ttf") format("truetype"), 
    font-url("cool-icons/cool-icon.svg") format("svg"); 
    font-weight: normal; 
    font-style: normal; 
} 

[class^="cool-icon-"]:before, [class*="cool-icon-"]:before, 
[class^="cool-icon-"]:after, [class*="cool-icon-"]:after { 
    font-family: CoolIcons; 
} 


.cool-icon-books:before { 
    content: "\e000"; 
} 

.... 

Устранение неисправностей :

вот как я могу решить проблему устранения недостающих активов. Цель здесь заключается в имитации того, что будет происходить в производстве, но и запустить его локально:

в развитии (локальная машина), я иду в мой конфигурационный/database.yml и добавить:

# ...(or equivalent for postgres): 
production: 
    adapter: mysql2 
    encoding: utf8 
    reconnect: false 
    database: projectname_development 
    pool: 5 
    username: root 
    password: 
    socket: /tmp/mysql.sock 

от вашего терминал, выполните команду:

#this will precompile your assets as if you were deploying for production 
RAILS_ENV=production bundle exec rake assets:precompile 

Теперь перейдите к публичной папке/активы, который был только что создан, и проверьте содержимое/имена каждого из файлов. Не перегружайтесь дополнительными символами в конце имен файлов, которые для перебора кеша.

Для каждого файла, который вы планируете ссылаться в своем html, убедитесь, что вы видите это соответствующее имя в новом каталоге public/assets.Если его там нет, ваша структура каталогов не совпадает между вашими файлами приложений и активов и тем, что вы поместили в свой список config.assets.precompile.

Кроме того, что вы используете для развертывания, capistrano? (Я, вероятно, следовало бы спросить, что первая :) И когда вы говорите:

stylesheets 
+compiled 
--theme.css #references bootstrap/bootstrap.min.css 

как вы ссылающийся самозагрузки/bootstrap.min.css?