gulp安装教程

1、安装nodejs并选装cnpm；

npm install cnpm -g --registry=https://registry.npm.taobao.org

2、全局安装gulp；

cnpm install gulp -g

3、新建package.json文件；（第二次在项目中使用gulp时可跳过1、2步）

进入项目文件夹，cnpm init

4、本地安装gulp；

cnpm install gulp --save-dev 

5、安装gulp插件；

cnpm install ### --save-dev （###为插件名）

6、新建gulpfile.js文件；

 1 var gulp = require('gulp'),
 2     htmlmin = require('gulp-htmlmin');
 3  
 4 gulp.task('CompressHtml', function () {
 5     var options = {
 6         removeComments: true,//清除HTML注释
 7         collapseWhitespace: true,//压缩HTML
 8         collapseBooleanAttributes: true,//省略布尔属性的值 <input checked="true"/> ==> <input />
 9         removeEmptyAttributes: true,//删除所有空格作属性值 <input id="" /> ==> <input />
10         removeScriptTypeAttributes: true,//删除<script>的type="text/javascript"
11         removeStyleLinkTypeAttributes: true,//删除<style>和<link>的type="text/css"
12         minifyJS: true,//压缩页面JS
13         minifyCSS: true//压缩页面CSS
14     };
15     return gulp.src('index.html')//需压缩的HTML文件
16         .pipe(htmlmin(options))
17         .pipe(gulp.dest('dist/html'));//'dist'为存放文件夹
18 });
View Code

7、通过命令提示符运行gulp任务。

gulp 任务名称

gulp CompressHtml

 

posted @ 2016-09-30 11:41  JohnYunhan  Views(166)  Comments(0)  Edit  收藏  举报