尝试将sass/scss文件编译为css文件（一对一）

Question

我们试图将我们的sass文件编译为css文件，但是我们希望将每个单独的sass文件编译为单独的css文件（一对一）。

例如，我们的product_view.scss应该有一个product_view.css。

但是，我们尝试过的所有配置都在我们的“out/css”文件夹中创建了一个名为styles.css的所有css文件。

sass: { 
    dist: { 
     options: { 
      compass: true, 
      style: 'expanded' 
     }, 
     files: [{ 
      expand: true, 
      cwd: '<%= pkg.src %>/assets/sass', 
      src: ['*.scss'], 
      dest: '<%= pkg.src %>/assets/media/out/css', 
      ext: '.css' 
     }] 
    }, 

}, 

Answer 1

我用grunt-contrib-compass（指南针）来编译我的SASS，它有一些很好的附加功能。例如，罗盘包括重置工具，可以通过使用

@import 'compass/reset'; 

但无论使用，指南针也可以单独输出每个文件（只要它不与_它们是可以被包括在内，但赢得的文件开始”自己编译）。下面是我在gruntfile使用设置：

compass: { 
    'default': { 
     options: { 
      sassDir: "css/sass/", 
      cssDir: "css/", 
      outputStyle: "compressed" 
     } 
    } 
}