19

我可以使用Sass将多个 .SCSS 或 .SASS 输入文件编译成单个 .CSS 输出文件，使用如下@import所述。

如果我使用@import包含普通的 .CSS 文件，它们不会被合并。输出的 .CSS 文件仍然包含@import指令。这就说得通了。

但是有没有办法可以覆盖这种行为，也许是命令行切换到 Sass 编译器？换句话说，我可以告诉 Sass 尝试强制合并@import "foo.css";，就好像它是一个 .SCSS 文件一样？

我正在使用包含许多 .CSS 文件的第三方库（Google Closure Library ）。我在我的项目中只使用了其中的一些。我宁愿避免手动解决方案，例如将所有这些文件重命名为 .SCSS（尽管这似乎可行）或将它们的内容复制并粘贴到我的 .SCSS 文件中（也可以）。而且我不想在客户端将它们全部导入。我真的很希望 Sass 包含我“按原样”使用的几个 .CSS 文件并生成单个输出样式表。可能的？还有其他我应该看的工具吗？

4

3 回答 3

11

每个 CSS 文件也是一个有效的 SCSS。因此，如果您更改需要“不可见”导入或合并的文件，_filename.scss然后使用（扩展可选）从主 scss 文件 @import，@import "filename";它应该编译成一个没有 @import 语句的大 CSS在里面

编辑添加：抱歉刚刚在浏览器崩溃后看到您的编辑.. 看到这不是您要查找的内容，我不知道其他方式

于 2011-04-16T17:41:10.640 回答
3

我还没有找到在 Sass 中执行此操作的方法。

我的解决方法是直接从其 URL 导入第三方库。当然，这只适用于通过 URL 提供的 CSS 库。它仍在导入多个文件，但至少我不必重命名文件或管理供应商 CSS 库的修改副本。

例子：

// ORIGINAL: locally managed, modified copy (bad), no @import in output (good)
@import 'my_modified_copy/closure/goog/css/common.scss';

// WORKAROUND: vendor-managed (good): @import in output (bad but acceptable)
@import 'http://closure-library.googlecode.com/svn/trunk/closure/goog/css/tab.css';

在发布之前，我可能会添加一个脚本以从供应商处获取当前版本并将所有 .css 文件重命名为 .scss 文件。但就目前而言，上述解决方法对于开发来说是可以接受的。

于 2011-04-18T15:51:15.673 回答
2

这可以在服务器端完成，如果可以的话，可以为您节省一些麻烦。由于您只是将文件合并在一起，而且它只是 CSS，因此信息中不应该有任何会损害您的网站的冲突。此外，随着框架的改进，这种方式使您可以灵活地对 CSS 进行更新。

Ruby 不是我选择的语言，但仍然非常可行地完成这里所需的一切。有一个用 Ruby 编写的工具，可以使用 CSS 和 JS 文件为您执行此操作。看看这篇博文以获得概要：http: //cjohansen.no/en/ruby/juicer_a_css_and_javascript_packaging_tool

我希望这会有所帮助，如果您需要其他任何内容，请告诉我。

于 2011-04-16T21:13:03.663 回答