gulp-sass 安裝SASS
主要編譯 sass / scss
安裝 NPM
npm install gulp-sass --save-dev
https://www.npmjs.com/package/gulp-sass
編譯 Scss 檔案
將要編譯 Scss 檔案目錄指定為專案scss/**/*.scss
目錄下的所有.scss
的檔案(包含所有階層目錄的檔案)
並將編譯後的 css 檔案指定放在css
目錄下
var gulp = require('gulp'); // 載入 gulp
var Sass = require('gulp-sass'); // 載入 gulp-sass
gulp.task('sass', function () { // 定義 sass 的任務名稱
gulp.src('styles/**/*.scss') // 指定要處理的 Scss 檔案目錄
.pipe(Sass()) // 編譯 Scss
.pipe(gulp.dest('html/tmp/css')); // sass 編譯完成後的匯出資料夾
});
執行
$ gulp sass
[17:31:07] Using gulpfile ~/gulpfile.js
[17:31:07] Starting 'sass'...
[17:31:07] Finished 'sass' after 12 ms
執行完畢就可以到css
目錄看編譯後的檔案的成果了!