gulp 搭建静态服务器

步骤:

安装依赖：npm i browser-sync --save-dev

导入browser-sync,通过create创建

设置Sass和Js任务，将其压缩重命名并引入页面，任务结束时reload服务

设置默认任务，此任务负责，初始化服务器，监视setJs和setCss的变化

var gulp = require("gulp");
var browser = require("browser-sync").create();
var concat = require("gulp-concat");
var rename = require("gulp-rename");
var sass = require("gulp-sass");
var minifyCss = require("gulp-minify-css");
var uglify = require("gulp-uglify");

gulp.task("setJs",()=>{
    gulp.src("./src/js/*.js")
    .pipe(concat("c.js"))
    .pipe(uglify())
    .pipe(rename("c.min.js"))
    .pipe(gulp.dest("./dist"))
    .on("end",browser.reload);
});

gulp.task("setSass",()=>{
    gulp.src("./src/sass/*.scss")
    .pipe(sass())
    .pipe(rename("main.min.css"))
    .pipe(minifyCss())
    .pipe(gulp.dest("./dist/"))
    .on("end",browser.reload);
});

gulp.task("default",()=>{
    browser.init({
        server:'./',
        port:4011
    });
    gulp.watch("./src/sass/*.scss",["setSass"]);
    gulp.watch("./src/js/*.js",["setJs"]);
});