├── gulpfile.js ├── gulpfile.php.js └── README.MD /gulpfile.js: -------------------------------------------------------------------------------- 1 | var gulp = require('gulp'), 2 | ugjs = require('gulp-uglify'), 3 | minicss = require('gulp-minify-css'), 4 | imagemin = require('gulp-imagemin'), 5 | rename = require('gulp-rename'), 6 | replace = require('gulp-replace'), 7 | rev = require('gulp-rev-append'), 8 | browserSync = require('browser-sync').create(); 9 | 10 | var path = './src/main/webapp/public'; 11 | var disPath = './src/main/webapp/'; 12 | 13 | gulp.task('css',function() { 14 | gulp.src('src/css/*.css') 15 | .pipe(minicss()) 16 | .pipe(gulp.dest('Public/css')); 17 | }); 18 | gulp.task('images', function () { 19 | gulp.src('src/images/*.*') 20 | .pipe(imagemin({ 21 | progressive: true 22 | })) 23 | .pipe(gulp.dest('Public/images')) 24 | }); 25 | gulp.task('ugjs',function() { 26 | gulp.src('src/js/*.js') 27 | .pipe(ugjs()) 28 | .pipe(gulp.dest('Public/js')); 29 | }); 30 | gulp.task('view',function() { 31 | gulp.src('src/views/**/*.html') 32 | .pipe(rev()) 33 | .pipe(gulp.dest('Application/Home/View')); 34 | }); 35 | 36 | gulp.task('build',['ugjs','css','view','testRev']); 37 | 38 | gulp.task('reload',function() { 39 | browserSync.init({ 40 | startPath : "src/views/Home", 41 | server: true 42 | }); 43 | }); 44 | 45 | browserSync.watch(["src/css/*.css","src/js/*.js","src/views/**/*.html"], function (event, file) { 46 | if (event === "change") { 47 | browserSync.reload(file); 48 | } 49 | }); 50 | 51 | -------------------------------------------------------------------------------- /gulpfile.php.js: -------------------------------------------------------------------------------- 1 | var gulp = require('gulp'), 2 | ugjs = require('gulp-uglify'), 3 | //minicss = require('gulp-minify-css'), 4 | imagemin = require('gulp-imagemin'), 5 | clean = require('gulp-clean'), 6 | replace = require('gulp-replace'), 7 | rev = require('gulp-rev-append'), 8 | ifElse = require('gulp-if-else'), 9 | htmlreplace = require('gulp-html-replace'), 10 | browserSync = require('browser-sync').create(), 11 | base64 = require('gulp-base64'), 12 | runSequence = require('run-sequence'), 13 | bsReload = browserSync.reload; 14 | 15 | var postcss = require('gulp-postcss'); //postcss本身 16 | var autoprefixer = require('autoprefixer'); 17 | var precss = require('precss'); //提供像scss一样的语法 18 | var cssnano = require('cssnano'); //更好用的css压缩! 19 | var sass = require('gulp-sass'); 20 | var sourcemaps = require('gulp-sourcemaps'); 21 | 22 | var path = './src/', 23 | csspath = './src/css/**/*.css', 24 | sasspath = './src/sass/**/*.scss', 25 | jspath = './src/js/**/*.js', 26 | htmlpath = './src/views/**/*.html', 27 | ifonpath = './src/webfont/**'; 28 | 29 | var disPath = './Public/', 30 | disCssPath = './public/css', 31 | disJsPath = './Public/js', 32 | disHtmlPath = './Application/Home/View', 33 | disifonpath = './Public/webfont'; 34 | 35 | var urlTag = ''; 36 | var NODE_ENV = ''; 37 | 38 | gulp.task('ugjs',function() { 39 | return gulp.src(jspath) 40 | .pipe(replace('__target__',urlTag)) 41 | .pipe(replace('../../','../../Public/')) 42 | .pipe(ifElse(NODE_ENV === 'public',ugjs)) 43 | .pipe(gulp.dest(disJsPath)); 44 | }); 45 | gulp.task('css',function() { 46 | var processes = [cssnano]; 47 | 48 | gulp.src(csspath) 49 | .pipe(ifElse(NODE_ENV === 'public',function() { 50 | return postcss(processes) 51 | })) 52 | .pipe(base64({ 53 | extensions: ['png', /\.jpg#datauri$/i], 54 | maxImageSize: 10*1024 // bytes, 55 | })) 56 | .pipe(gulp.dest(disCssPath)); 57 | }); 58 | gulp.task('sass',function() { 59 | var processes = [ 60 | autoprefixer({browsers: ['last 2 version', 'safari 5', 'opera 12.1', 'ios 6', 'android 4','> 10%']}), 61 | precss // background: color($blue blackness(20%)); precss为了用这样的语法 62 | ]; 63 | return gulp.src(sasspath) 64 | .pipe(sourcemaps.init()) 65 | .pipe(sass().on('error', sass.logError)) 66 | .pipe(postcss(processes)) 67 | .pipe(sourcemaps.write('./maps')) 68 | .pipe(gulp.dest('./src/css')); 69 | }); 70 | 71 | gulp.task('images', function () { 72 | return gulp.src('src/images/**/*.*') 73 | .pipe(imagemin({ 74 | progressive: true 75 | })) 76 | .pipe(gulp.dest('Public/images')); 77 | }); 78 | 79 | gulp.task('iconfont', function () { 80 | return gulp.src(ifonpath) 81 | .pipe(gulp.dest(disifonpath)); 82 | }); 83 | gulp.task('view',['clean'],function() { 84 | return gulp.src(htmlpath) 85 | .pipe(rev()) 86 | .pipe(replace('__target__',urlTag)) 87 | .pipe(replace('..\/..\/','__PUBLIC__/')) 88 | .pipe(replace(' * 本次新增postCSS+sass配置 3 | 4 | ```javascript 5 | var gulp = require('gulp'), 6 | ugjs = require('gulp-uglify'), 7 | //minicss = require('gulp-minify-css'), 8 | imagemin = require('gulp-imagemin'), 9 | clean = require('gulp-clean'), 10 | replace = require('gulp-replace'), 11 | rev = require('gulp-rev-append'), 12 | ifElse = require('gulp-if-else'), 13 | htmlreplace = require('gulp-html-replace'), 14 | browserSync = require('browser-sync').create(), 15 | base64 = require('gulp-base64'), 16 | runSequence = require('run-sequence'), 17 | bsReload = browserSync.reload; 18 | 19 | var postcss = require('gulp-postcss'); //postcss本身 20 | var autoprefixer = require('autoprefixer'); 21 | var precss = require('precss'); //提供像scss一样的语法 22 | var cssnano = require('cssnano'); //更好用的css压缩! 23 | var sass = require('gulp-sass'); 24 | var sourcemaps = require('gulp-sourcemaps'); 25 | 26 | var path = './src/', 27 | csspath = './src/css/**/*.css', 28 | sasspath = './src/sass/**/*.scss', 29 | jspath = './src/js/**/*.js', 30 | htmlpath = './src/views/**/*.html', 31 | ifonpath = './src/webfont/**'; 32 | 33 | var disPath = './Public/', 34 | disCssPath = './public/css', 35 | disJsPath = './Public/js', 36 | disHtmlPath = './Application/Home/View', 37 | disifonpath = './Public/webfont'; 38 | 39 | var urlTag = ''; 40 | var NODE_ENV = ''; 41 | 42 | gulp.task('ugjs',function() { 43 | return gulp.src(jspath) 44 | .pipe(replace('__target__',urlTag)) 45 | .pipe(replace('../../','../../Public/')) 46 | .pipe(ifElse(NODE_ENV === 'public',ugjs)) 47 | .pipe(gulp.dest(disJsPath)); 48 | }); 49 | gulp.task('css',function() { 50 | var processes = [cssnano]; 51 | 52 | gulp.src(csspath) 53 | .pipe(ifElse(NODE_ENV === 'public',function() { 54 | return postcss(processes) 55 | })) 56 | .pipe(base64({ 57 | extensions: ['png', /\.jpg#datauri$/i], 58 | maxImageSize: 10*1024 // bytes, 59 | })) 60 | .pipe(gulp.dest(disCssPath)); 61 | }); 62 | gulp.task('sass',function() { 63 | var processes = [ 64 | autoprefixer({browsers: ['last 2 version', 'safari 5', 'opera 12.1', 'ios 6', 'android 4','> 10%']}), 65 | precss // background: color($blue blackness(20%)); precss为了用这样的语法 66 | ]; 67 | return gulp.src(sasspath) 68 | .pipe(sourcemaps.init()) 69 | .pipe(sass().on('error', sass.logError)) 70 | .pipe(postcss(processes)) 71 | .pipe(sourcemaps.write('./maps')) 72 | .pipe(gulp.dest('./src/css')); 73 | }); 74 | 75 | gulp.task('images', function () { 76 | return gulp.src('src/images/**/*.*') 77 | .pipe(imagemin({ 78 | progressive: true 79 | })) 80 | .pipe(gulp.dest('Public/images')); 81 | }); 82 | 83 | gulp.task('iconfont', function () { 84 | return gulp.src(ifonpath) 85 | .pipe(gulp.dest(disifonpath)); 86 | }); 87 | gulp.task('view',['clean'],function() { 88 | return gulp.src(htmlpath) 89 | .pipe(rev()) 90 | .pipe(replace('__target__',urlTag)) 91 | .pipe(replace('..\/..\/','__PUBLIC__/')) 92 | .pipe(replace('