src is the development environment and dist is the production environment!
should my server load files under dist?
I have configured a hot load here, and the html browser under dist will change automatically when html is modified!
then every time I modify the less under src, I will generate a new md5. The json of the file mapping under css, rev has also changed, but the css of the path ms5 loaded by index has not changed! So that the page won"t change?
I"m a little confused if we preview the effect in a development environment or a production environment?
PHP, page rendering is still used in the background, and it is also done by the background
my goal is to compress js, compress css, compress html, compress image, or merge some js
. 
gulp
const gulp = require("gulp"); //gulp
const gulpsync = require("gulp-sync")(gulp);
const rev = require("gulp-rev"); //
const less = require("gulp-less"); //sass()
const clean = require("gulp-clean"); //
const uglify = require("gulp-uglify"); //JS()
const concat = require("gulp-concat"); //()
const htmlmin = require("gulp-htmlmin"); //html
const connect = require("gulp-connect"); //
const minify = require("gulp-minify-css"); //css()
const webserver = require("gulp-webserver"); //()
const browserify = require("gulp-browserify"); //JS()
const revCollector = require("gulp-rev-collector"); //html
const config = require("./gulp.config.js");
// ---------------------------css---------------------------
gulp.task("less",function(){
gulp.src(config.less.src)
.pipe(less()) //css
.pipe(minify()) //css
.pipe(rev()) //md5
.pipe(gulp.dest(config.less.dist)) //
.pipe(rev.manifest("rev-css-mainfest.json")) //
.pipe(gulp.dest(config.less.json)) //
.pipe(connect.reload())
})
// ---------------------------html---------------------------
gulp.task("html",function(){
var options = {
removeComments: true,//HTML
collapseWhitespace: true,//HTML
collapseBooleanAttributes: false,// <input checked="true"/> ==> <input />
removeEmptyAttributes: false,// <input id="" /> ==> <input />
removeScriptTypeAttributes: true,//<script>type="text/javascript"
removeStyleLinkTypeAttributes: true,//<style><link>type="text/css"
minifyJS: true,//JS
minifyCSS: true//CSS
};
gulp.src([config.html.rev,config.html.src])
.pipe(revCollector({replaceReved:true})) //
.pipe(gulp.dest(config.html.dist))
.pipe(connect.reload())
})
// ---------------------------server---------------------------
gulp.task("connect",function(){
connect.server({
root : "dist", //
port : 8000, //
livereload : true //
})
})
gulp.task("clean",function(){
gulp.src(["dist"])
.pipe(clean());
})
//
gulp.task("watch",function(){
gulp.watch(config.less.src,["less"])
gulp.watch(config.html.src,["html"])
})
//
gulp.task("default",gulpsync.sync(["watch","connect"]));
gulp.task("build", function(cb) {
runSequence("clean", ["less", "js"], "rev");
});