何时在 Rails 6 中使用 stylesheet_pack_tag 而不是 stylesheet_link_tag

Question

当使用 Rails 6 创建一个新的 rails 项目时，它会创建一个带有 stylesheet_link_tag 的 application.html.erb 来为 javascript 文件加载 CSS 和 javascript_pack_tag。

现在，rails 6 还提供了一个 stylesheet_pack_tag，所以我的问题是，什么时候使用它？如果我们使用它，我们是否需要在 app/javascript 文件夹中添加所有 CSS 文件？

使用 rails 6 和 webpacker 加载 css、图像的最佳实践是什么？

Answer 1

您应该使用stylesheet_pack_tag，如果要导入在的WebPack任何CSS如果已经启用了extract_css: true在任何环境config/webpacker.yml。

给定以下目录结构：

app/
  javascript/
    packs/
      application.js
    styles/
      site.css

以及以下代码application.js：

app/
  javascript/
    packs/
      application.js
    styles/
      site.css

您将<%= stylesheet_pack_tag 'application' %>在视图中使用，即样式表的名称与“包”的名称相匹配。

在这一点上，我还建议重命名app/javascript为app/frontend. 所以，关键的变化是config/webpacker.yml：

import '../styles/site.css'

app/
  frontend/
    packs/
      application.js
    styles/
      site.css