zoukankan      html  css  js  c++  java
  • gulp静态服务器的搭建

    gulp静态服务器的搭建

    对于vscode,编程的人都很熟悉,打开页面使用liveServer服务打开,用gulp来实现这种静态服务的搭建

    我使用的是gulp@4版本,

    //引入插件  其中gulp-load-plugins中的内部插件要自己下载,只是不需要引入了
    var gulp=require("gulp");
    var load=require("gulp-load-plugins")();
    var browser=require("browser-sync").create();
    
    function saveJS(done){
         gulp.src("./js/*.js")
        .pipe(load.concat("main.js"))
        .pipe(load.uglify())
        .pipe(load.rename("main.min.js"))
        .pipe(gulp.dest("./dist/js/"))
        .on("end",browser.reload);
         return done();
    }
    
    function saveCss(done){
        gulp.src("./sass/*.scss")
        .pipe(load.sass())
        .pipe(load.concat("main.css"))
        .pipe(load.minifyCss())
        .pipe(load.rename("main.min.css"))
        .pipe(gulp.dest("./dist/css/"))
        .on("end",browser.reload);  
        return done();
    }
    
    exports.default=function(){
        browser.init({   //服务
            server:"./",   //gulpfile 文件的目录
            port:4001
        })
        gulp.watch("./*.html",function(done){
            browser.reload();   //浏览器的自动刷新
            done();
        });
        gulp.watch("./js/*.js",saveJS);
        gulp.watch("./sass/*.scss",saveCss)
    }
    
  • 相关阅读:
    leetcode-剑指19-OK
    leetcode-剑指38-?
    leetcode-剑指36-OK
    leetcode-剑指41-OK
    leetcode-剑指20-OK
    leetcode-剑指16-OK
    nginx重写路由隐藏入口文件报错引发的思考
    Go之并发
    Go之接口
    Go实现学生管理系统
  • 原文地址:https://www.cnblogs.com/94-Lucky/p/13557752.html
Copyright © 2011-2022 走看看