Rails 3.2資產管道+自定義主題+引導

Question

希望有人可以幫助我，因爲我瘋狂閱讀/嘗試一切，以獲得我的CSS文件加載生產，但他們要麼不顯示或我得到一個404錯誤。

我的3.2 RoR應用程序正在使用購買的主題和引導程序的組合。當然，一切都看起來很棒，但一旦我推到產品上，沒有什麼能正常工作。

此外，我有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佈局我明確地調用以下CSS：

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

我試過使用application.cs s，其中* = require_tree。但是這會吸引所有的東西，並且從主頁佈局我不需要custom_theme。如果我創建homepage.css並省略custom_theme，則仍需要放入* = require_tree。因爲在theme.css中有對目錄中其他文件的引用。

最後，我試過在我的config/env/prod文件中顯式預編譯CSS，但是這並沒有引用引用的css文件。

編輯

每麥克的建議，我已經添加了以下到我的配置/ ENV/PROD文件：

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

每一個環節的結果你需要確保所有的你是不是包括你的application.css清單CSS文件放入到config /環境/ production.rb您config.assets.precompile列表：

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

這可以讓你的[R ails應用程序知道哪些資產可以正確縮小，醜化並預處理到相應的文件中進行生產。你可以閱讀更多關於如何真棒軌/鏈輪是在做資產預編譯自動化爲您here

編輯在回答您的評論：

你只需要包括資產（JS /咖啡/ CSS/SCSS ）在你的config.assets。預編譯陣列而不是包含在您的應用程序清單和您打算在您的HTML /別處引用。 Rails是一個了不起doc'ing的重要注意事項在自動生成的文件，並在config /環境/ 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" %> 

OR

<%= 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"; 
} 

.... 

故障排除 ：

這裏是我如何解決缺失的資產。這樣做的目的是模擬正在發生的事情在生產中發生，但在本地運行：參與發展（本機）

，我進入我的config/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？