SASS：在开发过程中将CSS文件分开并将它们合并到生产中

Question

我正在使用Grunt和SASS。我目前正在使用grunt-contrib-compass插件。

我的目标看似简单，但很难实现。

• 在开发过程中，我希望我的CSS可以在单独的文件中编译（因为开发工具，速度为watch等）。
• 对于制作，我希望将所有CSS合并为一个。

但是，使用concat任务无法完成任务。

当我有@import语句并且SASS分别编译每个文件时，它会在不同文件中一遍又一遍地从供应商库（如Bootstrap或Compass插件）输出相同的CSS。在开发中这很好。当我concat用于制作的CSS文件虽然它产生了一个带有重复CSS的更大的文件。

我应该如何配置Grunt并使用@import语句，以免发生这种情况？

Answer 1

不是一个确切的答案，而是另一种解决方案。

对于dev工具的使用，我建议调查.map文件。这将允许您拥有编译和缩小的css文件，但是当您打开开发人员工具时，您可以看到样式的位置，因为它们在原始sass文件中。

• 有关grunt plugins GitHub page。
的详细信息
• 关于Sass and source maps的指南。

我希望这会有所帮助。