gulp入门演练

一直想学习下gulp看了蛮多资料，然后总是感觉是是而非，突然开窍了，把自己学会的过程给大家分享下，入门超级简单的

gulp安装

• 安装gulp 如果参数-g 表示全局安装

  $ npm install gulp

  $ npm install gulp --save-dev

我们先来学习压缩JS文件，新建文件目录如下 

 

dist为解压后文件放置的目录（可自定义）

src为要解压的文件放置目录（可自定义）

gulpfile.js: gulp的配置文件，在根目录中

 

压缩思路1、找到要压缩的JS目录  src/app.js

　　　　2、压缩这些文件

           3、把压缩好的文件放置到压缩文件目录//dist

 

执行步骤1、安装压缩文件的插件  gulp-uglify模块

　　　　2、cpm install  gulp-uglify

　　　　3、再根目录下建立 gulpfile.js文件

gulpfile.js代码如下

　　　var gulp = require('gulp'),　

　　　uglify = require('gulp-uglify'); 　　　　

 　　  gulp.task('default', function(){

　　　 gulp.src('src/app.js')//找到src下面的app.js

　　　 .pipe(uglify())//对着js进行压缩

　　　 .pipe(gulp.dest('dist/'));//把压缩的文件放置到dist文件目录下
});

 

配置完成：执行压缩任务

再命令行输入：gulp 或者gulp default //defaule== gulp.task('default', function()这里这个命名

在dist/js/下就能看压缩后的文件了

 

 

表达有限 如果需要交流可以加入前端开发群 425019975 一起交流学习

　　参考地址 　　　　　　　　gulp官网 https://github.com/gulpjs/gulp

　　其他参考网站                   https://github.com/nimojs/gulp-book/blob/master/chapter1.md