问题标签 [cssbundling-rails]

我正在将我的 Rails 应用程序更新到版本 7。作为其中的一部分，我已经删除了 Webpacker，并试图将我的整个资产解决方案移动到新的 jsbundling-rails 和 cssbundling-rails gems。到目前为止，它工作得非常好，而且简单得多。

似乎不起作用的事情之一是 CSS 文件中引用的图像，这些文件是 3rd 方库（如 Photoswipe）的一部分。

库本身可以工作，但图像失败。Photoswipe 包含一个用于皮肤路径的 SCSS 变量，当我使用 Webpack 时，我将这一行设置如下：

这现在失败了，我已经尝试了很多东西的组合，但我似乎无法让这些图像正常工作。

这不仅仅是一个 Photoswipe 问题，它发生在许多其他引用图像的库中。

有什么建议么？

我使用 rails 7.0.1 并安装了 cssbundling-rails 来配置我的 sass。然后我用纱线安装了printjs。当我尝试导入它的 css 文件时，它在控制台中给了我这个错误：

http://localhost:5000/assets/bootstrap-select/dist/css/bootstrap-select.min.css net::ERR_ABORTED 404（未找到）

我这样调用文件：

我正在使用 ruby​​ Gem cssbundling-rails和dart-sass在 Rails 7 应用程序中处理 Sass（我对 Rails 还很陌生）。

在package.json文件中，我定义了build:css脚本：

这似乎有效；我看到几个 Sass 文件捆绑并处理成一个 CSS 文件的结果：app/builds/application.css。

但是我看不到如何将此文件添加到我的页面。我们使用 Slim，所以我包含了这条线

在app/views/components/_head.html.slim文件中。这会在最终的 HTML 中生成这个片段：

如果我将该文件（application-e0cf9d8fcb18bf7f909d8d91a5e78499f82ac29523d475bf3a9ab265d5e2b451.css）加载到我的浏览器中，我会看到它是一个空的清单文件

并且没有下面列出的文件。

我错过了什么？如何将从 Sass 文件捆绑和处理的 CSS 加载到我的 Slim 页面的app/builds/application.css文件中？

使用 Rails 7，我不明白为什么我的自定义 CSS 不起作用。

我为 Bootstrap 构建了带有标志的新 Rails 应用程序，该应用程序运行良好（CSS 和 JS，使用 bootstrap 模态测试）。这些是我的默认配置文件：

应用程序.js

应用程序.bootstrap.scss

包.json

我可以在其中构建 CSS/builds/application.css

现在我想添加自定义 CSS。这是我的过程：

1. 添加了新文件stylesheets/custom.css，带有css：

2. 添加导入到 application.bootstrap.scss

   @import "custom";

3. yarn run build:css

4. 现在我可以.my-class看到builds/application.css

但是当我尝试在 HTML 中使用 id 时，没有添加任何 CSS。为什么？我应该把它放在别的地方吗？

编辑： 我让它运行了，但只有当我手动运行 rails assets:precompile 然后 bin/dev 时。为什么每次更改时都需要预编译？