【2019.6.26更新版本】使用gulp將sass文件編譯成css樣式 + 瀏覽器異步執行

一、安裝gulp+sass（簡單方便）
https://www.gulpjs.com.cn/docs/getting-started/
1.全局安裝：npm install --global gulp
2.在本地項目裏打開命令框初始化項目:npm init
3.作爲項目的開發依賴安裝：npm install --save-dev gulp
4.安裝sass：npm install --save-dev gulp-sass

新增：瀏覽器異步執行 https://www.browsersync.io/docs/gulp
執行：npm install browser-sync gulp --save-dev

5.在項目根目錄下創建一個名爲 gulpfile.js 的文件 （最新版本）

const {task, src, watch, dest} = require('gulp');
const sass = require('gulp-sass');
const browserSync = require('browser-sync').create();

task('default', () => {

  browserSync.init({
    server: {
      baseDir: "./"
    }
  });

  watch(['scss/**.scss']).on('change', (path, stats) => {

    src(path)
      .pipe(sass({
        outputStyle: 'expanded'
      }))
      .pipe(dest("css"));

    browserSync.reload();
  });

  watch(['**/**.js', '**/**.html']).on('change', (path, stats) => {
    browserSync.reload();
  });
});

6.運行：gulp