为啥 bootstrap-sass 不能与 Rails 一起使用？

Posted 2023-05-09

【中文标题】为啥 bootstrap-sass 不能与 Rails 一起使用？

【英文标题】：Why doesn't bootstrap-sass work with Rails?为什么 bootstrap-sass 不能与 Rails 一起使用？

【发布时间】：2016-02-24 01:43:32

【问题描述】：

我已将 bootstrap-sass 添加到我的 gemfile 中。我已按照https://github.com/twbs/bootstrap-sass 此处的说明进行操作。已根据上述链接对 javascript/application.js.scss 和 stylesheet/application.css.scss 文件进行了修改。

当我尝试查看一个新的控制器时，我得到了这个：

Sass::SyntaxError in Test#index 显示 /Users/myuser/Rails/myproject/app/views/layouts/application.html.erb 提出第 5 行的位置：

找不到或无法读取要导入的文件：bootstrap-sprockets。

*/ @import "bootstrap-sprockets"; @import "引导"；

我还没有向 Rails 应用程序添加任何引导代码。这是一个新的 Rails 应用程序，只有上述修改和一个新控制器。

我确实运行了 bundle install 但它似乎没有安装任何东西。输出是这样的：

捆绑完成！ 13 个 Gemfile 依赖项，现在安装了 56 个 gem。采用 bundle show [gemname] 查看捆绑 gem 的安装位置。

还有一堆Usings。我确实看到了这些条目：

Using bootstrap-sass 3.3.5.1
Using bootstrap-sass 0.0.2

知道为什么会出现上述错误吗？

【问题讨论】：

javascript/application.js.scss 不是 CSS 文件，它是 javascript。您只需将 CSS 文件扩展名更改为使用 SCSS。

你可以像这个建议一样重启你的服务器***.com/questions/26135126/…

你的 gemfile 中有 gem 'sass-rails' 吗？

我已重命名文件。重新启动了服务器。是的 - sass-rails 在 gem 文件中。仍然没有变化。

【参考方案1】：

您的文件有点错误。

确保您拥有具有以下内容的 'app/assets/javascripts/application.js

// This is a manifest file that'll be compiled into application.js, which will include all the files
// listed below.
//
// Any JavaScript/Coffee file within this directory, lib/assets/javascripts, vendor/assets/javascripts,
// or any plugin's vendor/assets/javascripts directory can be referenced here using a relative path.
//
// It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the
// compiled file.
//
// Read Sprockets README (https://github.com/rails/sprockets#sprockets-directives) for details
// about supported directives.
//
//= require jquery
//= require bootstrap-sprockets
//= require_tree .

和 'app/assets/stylesheets/application.scss' 与以下

/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
 * or any plugin's vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any styles
 * defined in the other CSS/SCSS files in this directory. It is generally better to create a new
 * file per style scope.
 */
@import "bootstrap-sprockets";
@import "bootstrap";

注意文件名和扩展名

【讨论】：

我现在有相同的扩展名。我将“require bootstrap-sprockets”移到“require_tree”上方。但仍然没有变化。我得到同样的错误。

因为它是一个新应用程序，我认为不应该有任何其他文件。确保你有两个与上面完全相同的文件，然后不要忘记重新启动服务器

我的文件中的要求比你多。有一个项目正在运行。这也是一个新项目。文件没有区别。我确实记得在运行 bundle install 之后 bootstrap-sass 显示了一个 ascii 幽灵，你可以告诉它已安装。在另一个项目中，这并没有发生。 bootstrap-sass 确实显示为已安装在我的本地 gem 中。

1 rails new foo 2. 添加到 gemfile gem 'bootstrap-sass', '~> 3.3.5' 3. bundle 4. mv app/assets/stylesheets/application.css app/assets/stylesheets/application.scss 5. 从 application.scss 中删除 *= require_tree . *= require_self 5. 添加到 application.scss @import "bootstrap-sprockets"; @import "bootstrap"; 6. 在应用程序 js //= require bootstrap-sprockets 中的树前面放右可能是你在 scss 文件中还有 '=* require '

可能你的 scss 文件中还有 '=* require' 吗？你不应该