SASS編譯擴展和壓縮的CSS並重命名輸出

Question

我使用命令行sass --watch style.scss --style compressed輸出我的SCSS樣式表的壓縮CSS版本。

有沒有辦法輸出一個擴展和一個壓縮的CSS文件，分別調用它們style.css和style.min.css？

我讀了documentation，但沒有發現任何信息。

Answer 1

您可以運行兩個終端窗口，每個終端窗口都有一個觀察者。在一個你可以運行

sass --watch style.scss:style.css --style nested 

，並在其他你可以運行

sass --watch style.scss:style.min.css --style compressed 

，我不知道在一行做到這一點的方法。

Answer 2

最好的選擇是和Gulp或Grunt這樣的任務管理器一起工作。然後，您可以爲SASS指定兩個單獨的任務並運行grunt編譯（使用下面的Grunt示例）。一個用於壓縮，另一個用於擴展。否則，我只是在終端上運行另一個命令，如果你不想弄亂配置。

sass: { 

expanded: { 
    options: { 
     style: 'expanded' 
    }, 
    files: { 
     'css-expanded/*.css': 'sass/*.scss' 
    } 
} 
compressed: { 
    options: { 
     style: 'compressed' 
    } 
    files: { 
     'css-compressed/*.min.css': 'sass/*.scss' 
    } 
} 

grunt.registerTask('compile': ['sass:expanded', 'sass:compressed']);