首页 > 代码库 > gulp
gulp
1.安装全局gulp:
npm install --global gulp
2.安装项目依赖:
npm install --save-dev gulp
3.在项目根目录下创建文件名字为:gulpfile.js
4.配置当前gulpfile.js文件
5.执行gulp测试
语法:
1.gulp.src:方法读取你需要操作的文件
2.gulp.dest:方法用来写文件
3.gulp.task:方法用来定义任务的
4.gulp.watch:监听当前文件发生变化的
(1):js文件压缩
使用gulp-uglify
安装:npm install --save-dev gulp-uglify
(2):css文件压缩
使用gulp-minify-css
安装:npm install --save-dev gulp-minify-css
(3):html文件压缩
使用:gulp-minify-html
安装:npm install --save-dev gulp-minify-html
(4):代码检查工具jshint
使用:gulp-jshint
安装:npm install --save-dev gulp-jshint
(5):文件合并
gulp-concat
(6):重命名:
gulp-rename
(7):less:gulp-less gulp-sass
(8):自动刷新:
gulp-livereload
*/
//将gulp导入
var gulp = require(‘gulp‘);
uglify = require("gulp-uglify");
minifyCss = require("gulp-minify-css");
minifyHtml = require("gulp-minify-html");
jsHint = require("gulp-jshint");
concat = require("gulp-concat");
rename = require("gulp-rename");
//压缩js文件任务
gulp.task("minify-js",function(){
gulp.src("getInfo.js") //操作文件
.pipe(uglify()) //执行相应任务
.pipe(gulp.dest("dist/")); //将压缩之后的文件输出到哪里
});
//压缩all.js文件
gulp.task("minify-js-all",function(){
gulp.src("js/*.js")
.pipe(uglify())
.pipe(gulp.dest("dist/js"));
});
//压缩css文件
gulp.task("minifyCss",function(){
gulp.src("css/*.css")
.pipe(minifyCss())
.pipe(gulp.dest("dist/css"));
});
//压缩html文件
gulp.task("minifyHtml",function(){
gulp.src("*.html")
.pipe(minifyHtml())
.pipe(gulp.dest("dist/"));
})
//代码检查
gulp.task("jsHint",function(){
gulp.src("js/*.js")
.pipe(jsHint())
.pipe(jsHint.reporter());
})
//合并任务
gulp.task("concat",function(){
gulp.src("js/*.js")
.pipe(concat("all.js"))
.pipe(gulp.dest("dist/js"));
})
//合并,压缩,重命名
gulp.task("fjs",function(){
return gulp.src("js/*js")
.pipe(concat("main.js"))
.pipe(gulp.dest("dest/js"))
.pipe(rename({suffix:".min"}))
.pipe(uglify())
.pipe(gulp.dest("dests/"));
});
//less编译
gulp.task("less",function(){
gulp.src("less/*.less")
.pipe()
.pipe(gulp.dest("dist/css"));
})
// 配置任务
gulp.task(‘default‘, function() {
// console.log("Hello gulp");
gulp.start("minify-js-all","minifyCss","minifyHtml","jsHint","concat","fjs"); //执行压缩任务
});
gulp
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。