glup安装和使用

安装

1.首先安装全局的gulp,随便哪个文件夹下输入命令行：npm install -g gulp,

2.找到项目文件夹，初始化，命令行：npm init

3.项目文件夹下出现一个package.json的文件

4.在项目中安装gulp,命令行：npm install gulp --save -dev

5. 在项目文件夹下，新建一个文件夹，名字：src

6. 在项目文件夹下，新建一个文件，名字：gulpfile.js

就可以在这个文件里，做各种操作

常用的方法：

gulp.task -- 定义任务

gulp.src --找到需要执行任务的文件

gulp.dest --执行任务的文件的去处

gulp.watch --观察文件是否发生变化

如何进行图片压缩

1.在项目文件夹目录下安装，命令：npm install gulp-imagemin --save -dev

2.在gulpfile.js里引入压缩图片模块

var imagemin = require("gulp-imagemin");

3.

4.执行gulp imageMin

如何压缩JS文件

1.在项目文件夹目录下安装，命令：npm install gulp-uglify --save -dev

2.在gulpfile.js里引入压缩图片模块

var uglify = require("gulp-uglify");

3.

4.执行gulp minify

如何把SASS文件转成CSS文件

1.在项目文件夹目录下安装，命令：npm install gulp-sass --save -dev

2.在gulpfile.js里引入转换模块

var uglify = require("gulp-uglify");

3.

4.执行gulp sass

执行多个任务

在终端直接输入gulp即可完成多个任务

如何合并代码

1.在项目文件夹目录下安装，命令：npm install gulp-concat --save -dev

2.在gulpfile.js里引入合并代码模块

var concat = require("gulp-concat");

3.

4.执行gulp scripts

监听文件

不需要下载安装其他的模块，

直接在终端输入：gulp watch即可，如果文件发生变化，会自动改变