gulp的使用

gulp是一个构建工具,可以通过它自动执行网站开发过程中的公共任务,例如:编译sass/less,编译压缩混淆javaScript,合并编译模板和版本控制等。

安装gulp

首先,检测node.js是否存在,因为gulp的使用需要node环境。

接着,在项目目录中安装gulp为本地模块

本地安装gulp

npm install --save-dev gulp

最后,安装项目中依赖的 gulp plugin模块gulp-cssmin, gulp-jshint

npm install --save-dev gulp-cssmin gulp-jshint

使用

首先,在根目录中创建一个gulpfile文件。然后写.....

var gulp = require('gulp'); //加载gulp模块
var uglifyJs = require('gulp-uglify'); //加载uglify模块
var cleanCss = require('gulp-clean-css'); //加载clean模块
//定义一个压缩js代码的任务
gulp.task('uglifyJs', [], function() {
gulp.src('build/.js') //找到原始文件
.pipe(uglifyJs()) //压缩js代码
.pipe(gulp.dest('js')); //压缩后的代码储存在这里
});
// //定义一个压缩css代码的任务
//gulp.task('cleanCss', [], function() {
// gulp.src('gulp/
.css') //找到原始文件
// .pipe(cleanCss()) //压缩css代码
// .pipe(gulp.dest('gulp/build')); //压缩后的代码储存在这里
//});
// //定义一个监听任务
gulp.task('watch', function() {
//监听文件,一旦文件有变化,就执行相应的任务
gulp.watch('build/.js', ['uglifyJs']);
// gulp.watch('gulp/
.css', ['cleanCss']);
});
// //默认执行的任务, 执行完数组中的任务之后,再执行当前任务
gulp.task('default', ['uglifyJs'], function() {
console.log('执行完毕');
});

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容