gulp的使用

1. 什么gulp ?
   前端自动化构建工具 之一,市场还有 Grunt,webpack.都是基于nodejs环境.

2. gulp的模块
   gulp-htmlmin 压缩html,去掉注释,去掉空格等等…

   gulp-cssmin–>gulp-clean-css,压缩css

   gulp-connect 合并js文件

   gulp-less 自动生成css

   gulp-imagemin 压缩图片

3. gulp的方法

   1. task 创建人物
   2. src 指定资源
   3. pipe 管道方法
   4. dest 指定目标方法
   5. watch 监听方法

4. 如何使用?

借鉴资料
http://www.ydcss.com/archives/18

1.全局安装

npm install  gulp -g

2. 项目里面安装

npm install gulp --save-dev

3. 引入gulp
4. 新建一个文件 gulpfile.js

let gulp=require(“gulp”);

gulp.task(“人物名称”,function(){
gulp.src([‘xxx.html’])
.pipe(组件方法)
.pipe(gulp.dest(‘目标’))

})

结合 browser-sync

var gulp = require('gulp');
var browserSync = require('browser-sync').create();

// 静态服务器
    gulp.task('aaa', function() {
           browserSync.init({
               server: {
                   baseDir: "./",
                   port: 8082
               },
               logLevel: "debug",
               port: 8082,
    		   files: ["*.css","*.js","*.html","*.htm"]
           });
       });