Skip to content

Instantly share code, notes, and snippets.

@suncn
Forked from yukal/gulpfile.js
Last active May 8, 2017 08:39
Show Gist options
  • Save suncn/7cb0a159273e4976ba3dfcc2073d6c4c to your computer and use it in GitHub Desktop.
Save suncn/7cb0a159273e4976ba3dfcc2073d6c4c to your computer and use it in GitHub Desktop.
gulp
'use strict';
const gulp = require('gulp'),
watch = require('gulp-watch'),
prefixer = require('gulp-autoprefixer'),
uglify = require('gulp-uglify'),
less = require('gulp-less'),
requirejsOptimize = require('gulp-requirejs-optimize'),
sourcemaps = require('gulp-sourcemaps'),
rigger = require('gulp-rigger'),
cssmin = require('gulp-clean-css'),
imagemin = require('gulp-imagemin'),
pngquant = require('imagemin-pngquant'),
rimraf = require('rimraf'),
browserSync = require("browser-sync"),
reload = browserSync.reload;
const APP_VERSION = 'v.1.0';
const path = {
build: {
html: 'build/',
js: 'build/js/',
rjs: 'build/js/pages/',
css: 'build/css/',
img: 'build/img/',
fonts: 'build/fonts/'
},
src: {
html: 'src/*.html',
js: ['src/js/**/*.js', '!src/js/components/**/*.js', '!src/js/pages/*.js'],
mainConfigFile: 'src/js/common.js',
rjs: 'src/js/pages/**/*.js',
style: 'src/css/{pages,components}/*.less',
img: 'src/img/**/*.*',
fonts: 'src/fonts/**/*.*'
},
watch: {
html: 'src/**/*.html',
// js: ['src/js/**/*.js', '!src/js/components/**/*.js', '!src/js/pages/*.js'],
// mainConfigFile: 'src/js/common.js',
rjs: 'src/js/pages/**/*.js',
style: 'src/css/**/*.less',
img: 'src/img/**/*.*',
fonts: 'src/fonts/**/*.*'
},
clean: './build'
};
gulp.task('webserver', function() {
var config = {
server: {
baseDir: "./build"
},
tunnel: true,
host: 'localhost',
port: 9000,
logPrefix: "Frontend_Demon"
};
browserSync(config);
});
gulp.task('clean', function(cb) {
rimraf(path.clean, cb);
});
gulp.task('html:build', function() {
gulp.src(path.src.html)
.pipe(rigger())
.pipe(gulp.dest(path.build.html))
.pipe(reload({
stream: true
}));
});
gulp.task('js:build', function() {
gulp.src(path.src.js)
.pipe(rigger())
.pipe(sourcemaps.init())
.pipe(uglify())
.pipe(sourcemaps.write())
.pipe(gulp.dest(path.build.js))
.pipe(reload({
stream: true
}));
});
// require page模块压缩后复制到发布文件夹
gulp.task('r-js:build', function() {
return gulp.src(path.src.rjs)
.pipe(requirejsOptimize(function(file) {
// console.log("what's", file);
return {
// todo 动态名称未实现
name: 'pages/index',
mainConfigFile: path.src.mainConfigFile,
exclude: [
'jquery',
'flexSlider',
'underscore',
'backbone',
'text',
'i18n'
]
};
}))
.pipe(gulp.dest(path.build.rjs));
});
gulp.task('style:build', function() {
gulp.src(path.src.style)
.pipe(sourcemaps.init())
.pipe(less({
includePaths: ['src/css/'],
outputStyle: 'compressed',
sourceMap: true,
errLogToConsole: true
}))
.pipe(prefixer())
.pipe(cssmin())
.pipe(sourcemaps.write())
.pipe(gulp.dest(path.build.css))
.pipe(reload({
stream: true
}));
});
gulp.task('image:build', function() {
gulp.src(path.src.img)
.pipe(imagemin({
progressive: true,
svgoPlugins: [{
removeViewBox: false
}],
use: [pngquant()],
interlaced: true
}))
.pipe(gulp.dest(path.build.img))
// Todo 精灵图相关未实现
// .pipe(reload({
// stream: true
// }));
});
gulp.task('fonts:build', function() {
gulp.src(path.src.fonts)
.pipe(gulp.dest(path.build.fonts))
});
gulp.task('build', [
'html:build',
'js:build',
'r-js:build',
'style:build',
'fonts:build',
'image:build'
]);
gulp.task('watch', function() {
watch([path.watch.html], function(event, cb) {
gulp.start('html:build');
});
watch([path.watch.style], function(event, cb) {
gulp.start('style:build');
});
// watch([path.watch.js], function(event, cb) {
// gulp.start('js:build');
// });
watch([path.watch.rjs], function(event, cb) {
gulp.start('js:build');
gulp.start('r-js:build');
});
watch([path.watch.img], function(event, cb) {
gulp.start('image:build');
});
watch([path.watch.fonts], function(event, cb) {
gulp.start('fonts:build');
});
});
gulp.task('default', ['build', 'webserver', 'watch']);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment