gulp常用任务

'use strict';

// 载入gulp核心包
const gulp = require('gulp');

// gulp是用来帮我们执行一些重复操作的,
// 一般我们将这些重复操作划分为不同的任务

// 如何定义一个任务
// 第一个参数是任务名 ,第二个参数是任务执行体
gulp.task('hello', function() {
  console.log('hello itcast');
  // 这里编写一些重复性的流程
});

// 让任务运行还是借助命令行
//
// 拷贝文件
gulp.task('dest', function() {
  // 获取文件
  gulp.src(['src/**/*.*', 'src2/*.*', '!src/demo.html'])
    // 让文件流走向下一个环节
    .pipe(gulp.dest('dist/'));
});


gulp.task('default', function() {
  console.log('这是默认任务');
  // 当src目录下的文件发生变化时,自动执行后面的任务
  gulp.watch('src/*', ['dest']);
});

//npm包官网  https://www.npmjs.com/package/gulp-less   https://
// gulp 原本不支持任何功能,只提供最基础API
//

const less = require('gulp-less');

gulp.task('style', function() {
  return gulp.src('src/**/*.less')
    // 让less转换为CSS gulp-less
    .pipe(less())
    .pipe(gulp.dest('dist/'));
});

gulp.task('watch', function() {
  gulp.watch('src/**/*.less', ['style']);
});


// 定义一个HTTP服务器

const connect = require('gulp-connect');

gulp.task('serve', function() {
  // 创建一个服务器 默认监听8080端口
  connect.server({
    root: 'public',
    livereload: true
  });

  gulp.watch('public/**/*.*', ['reload']);
});

gulp.task('reload', function() {
  gulp.src('public/**/*.*')
    .pipe(connect.reload());
});

 

posted @ 2016-02-24 00:06  XINYUHAI77  阅读(350)  评论(0编辑  收藏  举报