Grunt：如何将.CSS文件压缩到我编译的.SCSS文件中？

我在学咕噜，太棒了

背景：

我的项目是使用SASS（

.scss

）构建的，我使用grunt的

compass

插件在输出时将多个

.scss

编译成一个

.CSS

问题：

我正在使用一个jQuery插件，它有一个与之关联的

.css

文件。我希望我的Grunt能做到以下几点：

将*.SCSS编译成

frontend.css

完成后，将

plugin.css

放在

frontend.css

缩小

frontend.css

我已经尝试为我的CSS添加concat规则，它在grunt compass编译之后运行。concat规则如下所示

concat: {
  css: {
    src: ['www/assets/css/frontend.css',
          'bower_components/bootstrap-datepicker/css/plugin.css'],
    dest: 'www/assets/css/frontend.css'
  }    
}

下面是grunt任务的外观：

  grunt.registerTask('default', ['newer:concat:vendors', 'copy', 'uglify', 'compass:dist', 'newer:concat:css', 'newer:cssmin', 'newer:imagemin']);

下面是我正在使用的Grunt插件列表：

 // Load Grunt Tasks 
 grunt.loadNpmTasks('grunt-contrib-concat');
 grunt.loadNpmTasks('grunt-contrib-uglify');
 grunt.loadNpmTasks('grunt-contrib-cssmin');
 grunt.loadNpmTasks('grunt-contrib-compass');
 grunt.loadNpmTasks('grunt-contrib-watch');
 grunt.loadNpmTasks('grunt-contrib-copy');
 grunt.loadNpmTasks('grunt-contrib-imagemin');
 grunt.loadNpmTasks('grunt-newer');

如果我调用

concat:css

，plugin.css会被连接起来，但是每次我运行任务时，它都会被一次又一次地添加，因此相同css的多个副本会被插入到文件中

如果我调用

newer:concat:css

，则该文件永远不会连接到

frontend.css

---

非常感谢任何帮助

最简单的解决方案是使用，只需在每次生成时删除文件即可：

clean: {
    css: ['www/assets/css/frontend.css']
}

或者不安装插件：

grunt.registerTask('clean:css', function () {
    grunt.file.delete('www/assets/css/frontend.css');
});

---

为什么不把

plugin.css

复制到一个新的

plugin.scss

文件中呢？这是我通常做的。@sdsanders他正在用bower安装css，所以他可能无法永久重命名它。@sdsanders，就像jgillich指出的，我正在使用bower，所以我不想这样做。：）不过，感谢您的建议。@Prefix概述了使用Grunt解决此问题的另一种方法。