这里我有一个监视任务,它将创建
build
根据我的目录
src
.我的
建造
目录将包含两个名为
debug
和
release
gulp-webserver
index.html
// watch
gulp.task('watch',()=>{
gulp.watch(pathJS,gulp.series('js','js-min'));
gulp.watch(pathSCSS,gulp.series('sass','sass-min'));
gulp.watch(['src/**/*.*','!'+pathJS,'!'+pathSCSS],gulp.series('cp','cp-min'));
});
// webserver
gulp.task('webserver',()=>{
gulp.src(buildOptions.debugPath)
.pipe(webServer({
fallback: 'index.html',
port:'4000',
livereload:true,
open:true
}))
});
.
.
.
var default_tasks = ['build', 'webserver', 'watch'];
gulp.task('default',gulp.series('clean',...default_tasks));
gulpfile.js
以下内容:
const gulp = require('gulp');
const uglify = require('gulp-uglify-es').default;
const sass = require('gulp-sass');
const del = require('del');
const webServer = require('gulp-webserver');
const build_tasks=['js','js-min','sass','sass-min','cp','cp-min'];
const buildOptions={
releasePath:'build/release/',
debugPath:'build/debug/',
};
const pathJS = 'src/js/**/*.js'
const pathSCSS = 'src/style/**/*.scss'
gulp.task('js',()=>{
return gulp.src([pathJS])
.pipe(gulp.dest(buildOptions.debugPath+'/js/'));
});
gulp.task('js-min',()=>{
return gulp.src([pathJS])
.pipe(uglify().on('error',uglify=>console.error(uglify.message)))
.pipe(gulp.dest(buildOptions.releasePath+'/js/'));
})
gulp.task('sass',()=>{
return gulp.src([pathSCSS])
.pipe(sass().on('error',sass.logError))
.pipe(gulp.dest(buildOptions.debugPath+'/style/'));
});
gulp.task('sass-min',()=>{
return gulp.src([pathSCSS])
.pipe(sass({outputStyle: 'compressed'}).on('error',sass.logError))
.pipe(gulp.dest(buildOptions.releasePath+'/style/'))
})
gulp.task('cp',()=>{
return gulp.src(['src/**/*.*','!'+pathJS,'!'+pathSCSS])
.pipe(gulp.dest(buildOptions.debugPath));
});
gulp.task('cp-min',()=>{
return gulp.src(['src/**/*.*','!'+pathJS,'!'+pathSCSS])
.pipe(gulp.dest(buildOptions.releasePath));
});
gulp.task('watch',()=>{
gulp.watch(pathJS,gulp.series('js','js-min'));
gulp.watch(pathSCSS,gulp.series('sass','sass-min'));
gulp.watch(['src/**/*.*','!'+pathJS,'!'+pathSCSS],gulp.series('cp','cp-min'));
});
gulp.task('webserver',()=>{
gulp.src(buildOptions.debugPath)
.pipe(webServer({
fallback: 'index.html',
port:'4000',
livereload:true,
open:true
}))
});
gulp.task('clean',function(){return del(['build']);});
gulp.task('build',gulp.parallel(...build_tasks));
function build(){
var default_tasks = ['build', 'webserver', 'watch'];
gulp.task('default',gulp.series('clean',...default_tasks));
}
build();