Ruby on rails 使用网页包在rails 6视图中导入单个css文件的最佳方法

所以我已经导入了application.scss和标签

<%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
<%= stylesheet_pack_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>

我的问题是，这是正确的方法吗

我是否总是必须创建js文件才能导入css文件

---

有更好的办法吗？

是的，有可能。您不需要创建单独的JS文件，只需为每个视图创建一个CSS“包”：

app/javascript
└── packs
    ├── application.js
    └── home.scss

在你看来：

<%= javascript_pack_tag 'home', 'data-turbolinks-track': 'reload' %>
<%= stylesheet_pack_tag 'home', media: 'all', 'data-turbolinks-track': 'reload' %>

演示应用程序，带有更改的分支：

注意事项：

通常不建议在每页使用多个“包”（例如“应用程序”和“主页”）（a）。Webpack无法知道您想要在包之间共享代码，除非您添加了特殊配置（请参见脚注）。我上面的回答假设您没有跨捆绑包复制导入（或者您可以复制）

Webpack仍然会创建一个JavaScript包来加载CSS包，因此您仍然需要

JavaScript\u pack\u标记

和

stylesheet\u pack\u标记

---

a。您可以使用

splitChunks

API（）跨捆绑包共享代码

只想添加到OP示例中：您只能在包中分离CSS或JS。在我的例子中，JS文件对于所有人来说都是唯一的，对于管理员视图和用户视图来说是不同的CSS文件。

app/javascript
└── packs
    ├── application.js
    └── home.scss

<%= javascript_pack_tag 'home', 'data-turbolinks-track': 'reload' %>
<%= stylesheet_pack_tag 'home', media: 'all', 'data-turbolinks-track': 'reload' %>