AssetTagHelper

在大多數情況下，要讓 rails 自動並正確地連結資產（css / js / images），你需要使用內建幫助程式。 （ 官方檔案 ）

圖片助手

IMAGE_PATH

這將返回 app/assets/images 中影象資源的路徑。

image_path("edit.png") # => /assets/edit.png

IMAGE_URL

這會將完整的 URL 返回到 app/assets/images 中的影象資源。

image_url("edit.png") # => http://www.example.com/assets/edit.png

IMAGE_TAG

如果要在源集中包含 <img src="" />-tag，請使用此助手。

image_tag("icon.png") # => <img src="/assets/icon.png" alt="Icon" />

JavaScript 助手

javascript_include_tag

如果要在檢視中包含 JavaScript 檔案。

javascript_include_tag "application" # => <script src="/assets/application.js"></script>

javascript_path

這將返回 JavaScript 檔案的路徑。

javascript_path "application" # => /assets/application.js

javascript_url

這將返回 JavaScript 檔案的完整 URL。

javascript_url "application" # => http://www.example.com/assets/application.js

樣式表助手

stylesheet_link_tag

如果要在檢視中包含 CSS 檔案。

stylesheet_link_tag "application" # => <link href="/assets/application.css" media="screen" rel="stylesheet" />

stylesheet_path

這將返回樣式表資產的路徑。

stylesheet_path "application" # => /assets/application.css

stylesheet_url

這將返回樣式表資產的完整 URL。

stylesheet_url "application" # => http://www.example.com/assets/application.css

用法示例

在建立新的 rails 應用程式時，你將自動在 app/views/layouts/application.html.erb 中擁有其中兩個幫助程式

<%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track': 'reload' %>
<%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %>

這輸出：

// CSS
<link rel="stylesheet" media="all" href="/assets/application.self-e19d4b856cacba4f6fb0e5aa82a1ba9aa4ad616f0213a1259650b281d9cf6b20.css?body=1" data-turbolinks-track="reload" />
// JavaScript
<script src="/assets/application.self-619d9bf310b8eb258c67de7af745cafbf2a98f6d4c7bb6db8e1b00aed89eb0b1.js?body=1" data-turbolinks-track="reload"></script>