使用bootstrap-sass时应该如何管理sass代码？

Question

The documentation说：

导入引导样式应用程序/资产/样式表/ application.scss：

// "bootstrap-sprockets" must be imported before "bootstrap" and "bootstrap/variables" 
@import "bootstrap-sprockets"; 
@import "bootstrap"; 

引导链轮必须引导的图标字体的工作之前进口。

确保文件具有.scss扩展名（或.sass for Sass语法）。如果您刚刚生成了新的Rails应用程序，则可能会附带.css文件。如果该文件存在，将送达，而不是无礼的话，那么将其重命名：

$ mv app/assets/stylesheets/application.css app/assets/stylesheets/application.scss 

然后，从文件中删除所有// =需要和// = require_tree语句。相反，使用@import导入Sass文件。

不要在Sass中使用// = require，否则您的其他样式表将无法访问Bootstrap组合变量或变量。

但是，如果按照他们的说法，我的其他样式表将不会自动包含，就像他们之前那样。我应该在布局中明确包含每个样式表吗？ AFAIU，这也会让我在生产环境中有单独的样式表，而不是像没有bootstrap-sass那样的样式表。

Answer 1

这里有几件事。首先，默认情况下，每个样式表都在开发中的单独http请求中提供服务，并且在生产中的一个请求中（它们被预编译为一个文件）。如果我们遵循这些文档，我们最终也会得到一个开发请求，这会消除仅编译已更改文件的性能优势。If we don't，我们最终可能会在我们的样式表中多次出现bootstrap。如果我们need some variables or mixinsin several stylesheets。

所以我建议有这样说：

application.sass（做笔记，我require_tree .之前把require_self）：

/* 
*= require_self 
*= require_tree . 
*/ 
// import bootstrap once 
@import "bootstrap-sprockets" 
@import "bootstrap" 
.d1 
    text-align: center 

welcome.sass：

// in other files import only some particular partials 
@import "bootstrap/variables" 
@import "bootstrap/mixins" 
.d2 
    text-align: right 

Answer 2

但是，如果按照他们的说法，我的其他样式表将不会自动包含在内，就像他们之前那样。

是的，你是对的。

1）您不应该从application.scss中删除您的require指令。他们不想使用require指令，因为在这种情况下，您无法在包含文件中使用SASS变量和mixin。

2）只需将application.css重命名为application.scss即可。他们需要它，因为在这种情况下，您将能够在application.scss文件内使用@import指令。这意味着你将能够在包含文件中使用SASS变量和mixin。

我应该从布局中明确包含每个样式表吗？

没有，只是让他们在application.scss

AFAIU，这也将让我有不同的样式表在生产环境中，而不是之一，因为它本来没有引导，萨斯。

不，您将在不同的环境中使用一个application.scss。