使用libsass和compass

Question

正如标题所述，编译时间超过50秒是不可接受的。那么，有没有办法，比如说：使用带有compass魔法（例如sprite mixins等）的单个（部分）文件，并且其余文件使用纯sass？

我正在考虑转移到less（引用导入），并用额外的grunt任务替换所有compass技巧，但我比较擅长sass而不是less。

我看到了这些票，但我希望有一种方法能够编译一个带有compass的单个文件，而其余的文件则会与libsass合并（有时我会使用sass 3.3语法，但如果我可以获得更好的编译时间，我可以退回到3.2）。

是否有人成功实现了这样的配置？

- Misiur

Answer 1

在我们的项目中（>100,000行CSS），我们成功地从grunt-contrib-compass转向使用grunt-sass和compass-mixins的组合，这些工具都是使用libsass而非ruby版本。这种方式既能得到compass的所有魔力，又能够提高编译时间性能，我们将编译时间从40秒以上缩短至500-600毫秒。一定要尝试一下。

---

更新2

这里有一个node模块，可以自动将上述库引入你的grunt环境中：

https://github.com/haithembelhaj/compass-importer

更新

创建一个针对libsass的端口显然在创建者的计划中：https://github.com/Compass/compass/issues/1916

- stffndtz

---

是的，这就是我要去的方向。虽然像 sprite 生成这样的东西需要用其他工具来代替。 (https://github.com/guardian/frontend/tree/master/tools/sprites) - Misiur

这个东西让我大吃一惊，除了移除指南针并且编译时间缩短5秒之外，没有做任何改变，它就能正常工作。 - cnp

为这个可怜的灵魂点赞，他需要维护10万行代码并在40秒内编译。 - Sam Becker

刚刚让前端开发人员高兴了一整天。移除了 grunt-contrib-compass 并安装了 grunt-sass 和 compass-importer。甚至不需要更改我的 scss 中的任何一行代码。 - GFoley83

Answer 2

这是有关Sass文件的答案（不是Scss）。请始终区分它们。

1. 在shell中运行 bower install compass-sass-mixins
2. 编辑你的Sass文件 @import "bower_components/compass-sass-mixins/lib/compass"

或者

1. 在shell中运行 npm i compass-sass-mixins
2. 编辑你的Sass文件 @import "node_modules/compass-sass-mixins/lib/compass"

---

功能列表： https://github.com/askucher/compass-sass-mixins

- Andrey Stehno

---

无论您使用哪种文件扩展名，它都可以工作。 - stffndtz