From fb562b88bd0e4038bbfe0b445687d18b1e05b5bf Mon Sep 17 00:00:00 2001 From: Ionut Date: Thu, 5 May 2016 12:09:49 +0300 Subject: [PATCH 1/2] Create deploy gulp task (for production) --- gulpfile.babel.js | 126 ++++++++++++++++++++++++++++++++++++++-------- package.json | 8 ++- 2 files changed, 113 insertions(+), 21 deletions(-) diff --git a/gulpfile.babel.js b/gulpfile.babel.js index b85b830..7cf1eea 100644 --- a/gulpfile.babel.js +++ b/gulpfile.babel.js @@ -7,23 +7,31 @@ import sass from 'gulp-sass'; import sourcemaps from 'gulp-sourcemaps'; import watchify from 'watchify'; import notify from 'gulp-notify'; -import reload from 'browser-sync'; import duration from 'gulp-duration'; import change from 'gulp-change'; -import rename from 'gulp-rename'; import runSequence from 'run-sequence'; - - - - +import clean from 'gulp-clean'; +import buffer from 'vinyl-buffer'; +import uglify from 'gulp-uglify'; +import cleanCSS from 'gulp-clean-css'; +import debug from 'gulp-debug'; +import mocha from 'gulp-mocha'; +//import rename from 'gulp-rename'; +//import reload from 'browser-sync'; const opts = Object.assign({}, watchify.args, { entries: 'src/index.js', - debug: true, }); gulp.task('watchify', () => { + + console.log('NODE_ENV is', process.env.NODE_ENV); + + opts.debug = !(process.env.NODE_ENV == 'production'); + + console.log('browserify debug mode is ', opts.debug); + let bundler = watchify(browserify(opts)); bundler.transform(babelify).on('update', rebundle); return rebundle(); @@ -33,38 +41,116 @@ gulp.task('watchify', () => { return bundler.bundle() .on('error', notify.onError()) .pipe(source('bundle.js')) + .pipe(buffer()) + .pipe(sourcemaps.init({ loadMaps: true })) + .pipe(sourcemaps.write('./')) .pipe(duration('rebuilding files')) .pipe(gulp.dest('./dist/js')); } }); -gulp.task('icomoon-variables', function() { +gulp.task('icomoon-variables', function () { return gulp.src(['./icomoon/variables.scss']) - .pipe(change(function(content){ + .pipe(change(function (content) { return content.replace('$icomoon-font-path: "fonts" !default;', '$icomoon-font-path: "./../fonts" !default;') })) .pipe(gulp.dest('./icomoon/')); }); -gulp.task('icomoon-fonts', function() { +gulp.task('icomoon-fonts', function () { gulp.src('./icomoon/fonts/*') .pipe(gulp.dest('./dist/fonts')); }); const scssPaths = ['./lib/**/*.scss', './scss/**/*.scss']; -gulp.task('sass', function() { - gulp.src(scssPaths) - .pipe(sourcemaps.init()) - .pipe(sass().on('error', notify.onError())) - .pipe(sourcemaps.write()) - .pipe(gulp.dest('./dist/css')); +gulp.task('sass', function () { + var piped = gulp.src(scssPaths); + + if (process.env.NODE_ENV !== 'production') { + piped = piped.pipe(sourcemaps.init()); + } + + piped = piped.pipe(sass().on('error', notify.onError())); + + if (process.env.NODE_ENV !== 'production') { + piped = piped.pipe(sourcemaps.write()); + } + + piped = piped.pipe(gulp.dest('./dist/css')); + + return piped; }); -gulp.task('app-sass', function(callback){ - runSequence('icomoon-variables','icomoon-fonts', 'sass', callback); +gulp.task('app-sass', function (callback) { + runSequence('icomoon-variables', 'icomoon-fonts', 'sass', callback); }); -const scssPathsToWatch = ['./lib/**/*.scss', './scss/**/*.scss','./icomoon/*']; -gulp.task('default', ['watchify', 'app-sass'], function() { +const scssPathsToWatch = ['./lib/**/*.scss', './scss/**/*.scss', './icomoon/*']; +gulp.task('default', ['watchify', 'app-sass'], function () { gulp.watch(scssPathsToWatch, ['app-sass']); }); + +gulp.task('clean', function () { + gulp.src('./dist', { read: false }) + .pipe(clean()); +}); +gulp.task('build', function () { + + console.log('NODE_ENV is', process.env.NODE_ENV); + + opts.debug = !(process.env.NODE_ENV == 'production'); + + console.log('browserify debug mode is ', opts.debug); + + var bundler = browserify(opts) + .transform(babelify) + .bundle() + .pipe(source('bundle.js')); + + if (process.env.NODE_ENV !== 'production') { + + console.log('extracting source maps for dev mode'); + + bundler = bundler.pipe(buffer()) + .pipe(sourcemaps.init({ loadMaps: true })) + .pipe(sourcemaps.write('./')); + } + + if (process.env.NODE_ENV === 'production') { + console.log('uglifying'); + bundler = bundler.pipe(buffer()).pipe(uglify()); + } + + bundler.pipe(duration('rebuilding files')) + .pipe(gulp.dest('./dist/js')); +}); + +//PRODUCTION +gulp.task('minify-css', function () { + return gulp.src('./dist/css/*.css') + .pipe(debug({ title: 'Minifying css:' })) + .pipe(cleanCSS({ compatibility: 'ie8' }, function (details) { + console.log(details.name + ': ' + details.stats.originalSize); + console.log(details.name + ': ' + details.stats.minifiedSize); + })) + .pipe(gulp.dest('./dist/css')); +}); + +gulp.task('apply-prod-environment', function () { + //setting this value would make some changes in react code (https://facebook.github.io/react/downloads.html) + process.env.NODE_ENV = 'production'; +}); + +gulp.task('unit-tests', function () { + //mocha src/test --reporter spec --compilers js:babel-register --recursive --watch + return gulp.src('./src/test/*.js') + .pipe(debug({ title: 'running tests:' })) + .pipe(mocha( + { + compilers: 'js:babel-register', + })); +}); + +gulp.task('deploy', function () { + return runSequence('apply-prod-environment', 'clean', 'build', 'app-sass', 'minify-css','unit-tests'); +}); \ No newline at end of file diff --git a/package.json b/package.json index c73057e..36037b9 100644 --- a/package.json +++ b/package.json @@ -9,16 +9,21 @@ "browser-sync": "^2.11.1", "browserify": "^12.0.1", "chai": "^3.5.0", + "del": "^2.2.0", "eslint": "^2.5.3", "eslint-plugin-react": "^4.2.3", - "del": "^2.2.0", "gulp": "^3.9.1", + "gulp": "^3.9.1", "gulp-babel": "^6.1.2", "gulp-change": "^1.0.0", + "gulp-clean": "^0.3.2", + "gulp-clean-css": "^2.0.6", + "gulp-debug": "^2.1.2", "gulp-duration": "0.0.0", "gulp-notify": "^2.2.0", "gulp-rename": "^1.2.2", "gulp-sass": "^2.2.0", "gulp-sourcemaps": "^1.6.0", + "gulp-uglify": "^1.5.3", "lodash": "^4.0.0", "mocha": "^2.4.5", "nock": "^7.2.2", @@ -35,6 +40,7 @@ "redux-thunk": "^1.0.3", "run-sequence": "^1.1.5", "sinon": "^1.17.3", + "vinyl-buffer": "^1.0.0", "vinyl-source-stream": "^1.1.0", "watchify": "^3.7.0", "winston": "^2.2.0" From db19eae5f8250ee15f94576e03c41bb52e8cdf8e Mon Sep 17 00:00:00 2001 From: Teodor Sandu Date: Fri, 6 May 2016 15:03:47 +0300 Subject: [PATCH 2/2] Added gulp-mocha module --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 074c652..83f8f38 100644 --- a/package.json +++ b/package.json @@ -20,6 +20,7 @@ "gulp-clean-css": "^2.0.6", "gulp-debug": "^2.1.2", "gulp-duration": "0.0.0", + "gulp-mocha": "^2.2.0", "gulp-notify": "^2.2.0", "gulp-rename": "^1.2.2", "gulp-sass": "^2.2.0", @@ -27,7 +28,6 @@ "gulp-uglify": "^1.5.3", "lodash": "^4.0.0", "mocha": "^2.4.5", - "mongodb": "^2.1.18", "nock": "^7.2.2", "path-to-regexp": "^1.2.1", "photoswipe": "^4.1.1",