Gulp - 将多个css文件合并为一个的最佳方法？

Question

将多个css文件缩小为一个的最佳方法是什么？

下面的gulp任务在缩小和连接后导致两个问题：

1. 我使用的bootstraps glyphicons已经消失。
2. 我的一些风格被打破了。该任务似乎重新排列某些样式的位置，例如#use isalpha to check enterted input is string or not #isalpha returns a boolean value Numbers = [] String = [] while(True): user_input = input("input : ") if user_input == "save": break elif user_input.isdigit(): Numbers.append(int(user_input)) print(sum(Numbers)/len(Numbers)) elif user_input.isalpha(): String.append(user_input) print(String) print (len(String)) else: print("Invalid input.") break 位于.footer{...}下方，但现在高于html{...}。我如何阻止它重新安排它们？

gulpfile：

html{...}

有什么想法吗？

Answer 1

我不知道它是否对你有帮助，但我认为你可以使用gulp-sass进行SASS预处理。在那里，您可以导入所有依赖项，并让gulp-sass缩小结果。我的gulp devstack中有类似的方法。 SASS（libsass）可以导入* .css文件，例如在你的main.scss中你可以写

@import "path/to/file";

请注意，没有.css扩展名！ 如果您不熟悉SASS我建议给它一个机会。

Answer 2

这不是一个常见的解决方案，但有时它会有所帮助。我做两分钟。捆绑：'head.bundle.min.css'和'foot.bundle.min.css'就像你一样。在head.bundle.min.css中我收集必须首先的样式。最后我将两个min bundle连接在一起。