配置个顺手的的gulpfile.js文件

前期用的是grunt,看了一下gulp。觉得语法比grunt简单,根据需求配置了一下基本满足了自己的需求。

var gulp=require('gulp'),
    less=require('gulp-less'),
    plumber=require('gulp-plumber'),
    prefix=require('gulp-autoprefixer'),
    notify=require('gulp-notify'),
    sftp=require('gulp-sftp'),
    concat=require('gulp-concat'),
    minifyCSS=require('gulp-minify-css'),
    browserSync=require('browser-sync');

var config={
    src:'./src/'
}

var src=config.src+'js/';

/* 服务器 */
gulp.task('serve',['less','js-concat'],function(){
    browserSync.init({
        server: {
            baseDir: "./",
            directory: true
        }
    });

    gulp.watch('src/less/**/*.less', ['less']);

    gulp.watch(['*.html','src/js/**/*.js']).on('change',function(){
      browserSync.reload();
      gulp.run('js-concat');
    });

});

/* less编译 */
gulp.task('less',function(){
    gulp.src('./src/less/style.less')
        .pipe(plumber())
        .pipe(less({
      paths: ['./src/less']
    }))
        .on('error',notify.onError(function (error) {
            browserSync.notify('less编译出错啦(︶︿︶)=凸 ,快去命令行查看!!!',10000000);
               return {
                   message: "Error: <%= error.message %>",
                title: "less编译出错"
             };
          }))
        .pipe(prefix(['last 15 versions', '> 1%', 'ie 8', 'ie 7'], { cascade: true }))
    .pipe(minifyCSS())
        .pipe(gulp.dest('css'))
        .pipe(browserSync.reload({stream:true}));
});

/* js拼接 */
gulp.task('js-concat',function(){
  return gulp.src([src+'base/*.js',src+'plugin/*.js',src+'common/*.js',src+'module/*.js',])
             .pipe(concat('bundle.js'))
             .pipe(gulp.dest('./js/'));
})

/* 默认任务 */

gulp.task('default',['serve'])
    原文作者:裴大鱼
    原文地址: https://segmentfault.com/a/1190000004182135
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞