要實現(xiàn)Sass到CSS的自動編譯，在 VS code自動將Sass編譯為CSS 一 的基礎(chǔ)上我們還有幾個步驟要完成廊散。
第一步：安裝 Gulp 和 gulp-sass######
# sudo install -g gulp gulp-sass```
######第二步：創(chuàng)建 Gulp Task ######
在項目的根目錄下創(chuàng)建 *gulpfile.js* 梧疲，寫入以下內(nèi)容：
var gulp = require('gulp');
var sass = require('gulp-sass');
gulp.task('sass', function() {
gulp.src('*.scss')
.pipe(sass())
.pipe(gulp.dest(function(f) {
return f.base;
}))
});
gulp.task('default', ['sass'], function() {
gulp.watch('*.scss', ['sass']);
})```
gulpfile.js
第三步：修改 tasks.json 配置######
修改 tasks.json 內(nèi)容幌氮，讓 node-scss 能夠監(jiān)聽 style.scss 的變化：
{
"version": "0.1.0",
"command": "gulp",
"isShellCommand": true,
"tasks": [
{
"taskName": "default",
"isBuildCommand": true,
"showOutput": "always",
"isWatching": true
}
]
}```
######第四步：運行Build任務(wù)######
點擊 **??B** 會執(zhí)行 ```node-sass --watch styles.scss styles.css```
命令，監(jiān)聽 *style.scss*文件的變化并編譯到 *style.css*该互。
