GulpJS 流构建系统

我要开发同款
匿名用户2014年03月10日
36阅读
开发技术JavaScript
所属分类开发工具、项目构建
授权协议MIT

作品详情

从头编写HTML\CSS\Javascript是上个世纪的事情了,如今的JavaScript都是通过CoffeeScript这样的支持句法缩写的编辑器写成的。如果你希望写完JavaScript能够一个工具完成代码清理优化工作,Gulp就是你的不二之选,GulpJS类似Ant或Maven之于Java。

示例代码:

var gulp = require('gulp');var coffee = require('gulp-coffee');var concat = require('gulp-concat');var uglify = require('gulp-uglify');var imagemin = require('gulp-imagemin');var sourcemaps = require('gulp-sourcemaps');var del = require('del');var paths = {  scripts: ['client/js/**/*.coffee', '!client/external/**/*.coffee'],  images: 'client/img/**/*'};// Not all tasks need to use streams// A gulpfile is just another node program and you can use all packages available on npmgulp.task('clean', function(cb) {  // You can use multiple globbing patterns as you would with `gulp.src`  del(['build'], cb);});gulp.task('scripts', ['clean'], function() {  // Minify and copy all JavaScript (except vendor scripts)  // with sourcemaps all the way down  return gulp.src(paths.scripts)    .pipe(sourcemaps.init())      .pipe(coffee())      .pipe(uglify())      .pipe(concat('all.min.js'))    .pipe(sourcemaps.write())    .pipe(gulp.dest('build/js'));});// Copy all static imagesgulp.task('images', ['clean'], function() {  return gulp.src(paths.images)    // Pass in options to the task    .pipe(imagemin({optimizationLevel: 5}))    .pipe(gulp.dest('build/img'));});// Rerun the task when a file changesgulp.task('watch', function() {  gulp.watch(paths.scripts, ['scripts']);  gulp.watch(paths.images, ['images']);});// The default task (called when you run `gulp` from cli)gulp.task('default', ['watch', 'scripts', 'images']);
声明:本文仅代表作者观点,不代表本站立场。如果侵犯到您的合法权益,请联系我们删除侵权资源!如果遇到资源链接失效,请您通过评论或工单的方式通知管理员。未经允许,不得转载,本站所有资源文章禁止商业使用运营!
下载安装【程序员客栈】APP
实时对接需求、及时收发消息、丰富的开放项目需求、随时随地查看项目状态

评论