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>