pford68 / gulp-scaffold

Scaffolding for my Gulp projects, done the way I like it, instead of the way Yeoman likes it.
MIT License
0 stars 0 forks source link

Generate my typical Gulp file #2

Closed pford68 closed 8 years ago

pford68 commented 9 years ago

Template

/**
 * Atmosphere-client build tasks
 *
 * To run a clean build:
 * (1) gulp clean
 * (2) gulp build
 *
 * To start the dev server:  gulp dev
 */
var gulp = require('gulp'),
    gutil = require('gulp-util'),               // For outputting gulp results to the console.
    del = require('del'),                       // For deleting files and directories
    merge = require("merge-stream"),            // Combines multiple streams into one.
    requireDir = require("require-dir"),        // Imports an entire directory
    config = require("config"),                   // Returns values from the config file(s) as a map.
    jshint = require('gulp-jshint'),            // JS linting
    csslint = require('gulp-csslint'),          // CSS linting
    browserify = require('browserify'),         // Using NodeJS-style imports
    source = require('vinyl-source-stream'),
    concat = require('gulp-concat'),
    uglify = require('gulp-uglify'),            // Minifying JS
    streamify = require('gulp-streamify'),      // gulp-uglify does not handle streams correctly.
    minifyHtml = require('gulp-minify-html'),
    cssmin = require('gulp-cssmin'),
    imagemin = require('gulp-imagemin'),
    rename = require('gulp-rename'),
    inject = require("gulp-inject"),            // Injecting script tags and link tags into HTML
    sass = require("gulp-sass"),
    gulpif = require("gulp-if"),
    gDestDir = "./build",                       // The build directory
    tasks = requireDir("./tasks");              // Gulp tasks for sub-projects and specific deployments (e.g., development)

//======================================================================== Tasks

/*
 Clean task:  deletes the build directory
 */
gulp.task('clean', function(done) {
    console.log("Cleaning " + gDestDir + "...");
    del(gDestDir, function(){
        console.log("Deleted " + gDestDir + ".");
        done();
    });
});

/*
Browserify task.

Fetches dependencies, and compresses the resulting JS bundle if not in debug mode.
 */
gulp.task("browserify", function(){

    var b = browserify({
        entries: './main.js',
        basedir: './src/js',
        debug: config.debug
    });

    return b.bundle()
        .pipe(source('./src/js/main.js'))
        .pipe(gulpif(config.debug === false, streamify(uglify())))
        .pipe(rename('emra-client.js'))
        .pipe(gulp.dest('./build/js'));
});

/*
Running SASS

Compresses the resulting CSS file if not in debug mode
 */
gulp.task('sass', function () {
    // Omitting "sass" in src path below created an unwanted "sass" sub-directory.
    var dest = './build/css',
        src = ['./src/sass/main.scss', './src/sass/login.scss'];
    del.sync(dest);
    return gulp.src(src)
        .pipe(sass())
        .pipe(gulpif(config.debug === false, cssmin()))
        .pipe(gulp.dest(dest));
});

/*
Fonts task:  copying bootstrap fonts to the proper location
 */
gulp.task('fonts', function () {
    // Omitting "sass" in src path below created an unwanted "sass" sub-directory.
    var dest = './build/fonts/',
        src = [
            './node_modules/bootstrap/dist/fonts/*',
            './node_modules/font-awesome/fonts/*'
        ];
    del.sync(dest);

    var tasks = [];
    tasks.push(gulp.src(src[0])
        .pipe(gulp.dest(dest + "/bootstrap")));
    tasks.push(gulp.src(src[1])
        .pipe(gulp.dest(dest)));

    return merge(tasks);
});

/*
 Images task:  copying images to the proper location
 */
gulp.task('images', function () {
    var dest = './build/images',
        src = './src/images/*';
    del.sync(dest);
    return gulp.src(src, { base: './src/images' })
        .pipe(imagemin()).pipe(gulp.dest(dest));
});

/*
 Linting
 */
gulp.task('lint', function() {
    return gulp.src(['./src/**/*.js', '!./src/lib/**'])
        .pipe(jshint())
        // You can look into pretty reporters as well, but that's another story
        .pipe(jshint.reporter('default'));
});

/*
CSS Linting
*/
gulp.task('css-lint', ['sass'], function() {
    return gulp.src('./build/**/*.css')
        .pipe(csslint('.csslintrc'))
        // You can look into pretty reporters as well, but that's another story
        .pipe(csslint.reporter());
});

/*
Copies angular templates to the build directory.
*/
gulp.task('views', function(){
    return gulp.src([
        './src/js/**/*.html'
    ], { base: './src/js/components' })
        .pipe(gulp.dest(gDestDir + "/views"));
});

/*
 Builds the entire project.
 */
gulp.task("build", ['fonts', 'images', 'lint', 'css-lint', 'browserify', 'views'], function(){
    console.log("build: ", config.services);
    return gulp.src([
        './src/*.html'
    ], { base: './src' })
        .pipe(gulp.dest(gDestDir));
});
pford68 commented 9 years ago

Add the dev tasks

/**
 * Gulp tasks specific to development.
 *
 *
 *   NOTES:
 *   (1) The livereload module works best with Chrome's Livereload extension:
 *       See https://www.npmjs.org/package/gulp-livereload
 */

var gulp = require('gulp'),
    gutil = require('gulp-util'),
    jshint = require('gulp-jshint'),
    csslint = require('gulp-csslint'),
    async = require("async"),
    seedData = require("./users.json"),
    livereload = require('gulp-livereload'),   // See Note 1 above
    MongoDriver = require('mongodb'),
    config = require("config"),
    conn = config.connection,
    entanglement = require("./entanglement"),
    components = require("./components");

/*
 Build/rebuild the dev database
  */
gulp.task('rebuild-dev', function(){
    var DB = new MongoDriver.Db(conn.database, new MongoDriver.Server(conn.host, conn.port), { w: 1 });
    var userCollection = DB.collection("users");
    async.series([
        function(cmd){
            DB.open(function (err, db){
                if (err) throw err;
                cmd(null, "Connected to the database " + config.database);
            });
        },
        function(cmd) {
            userCollection.drop(function(err, result){
                cmd(null, "User collection cleared");
            });
        },
        function(cmd) {
            userCollection.insert(seedData, { w: 1 }, function (err, result) {
                DB.close();
                cmd(err, result);
            });
        }
    ]);
});

/*
Linting all sub-projects
 */
gulp.task('lint', function() {
    return gulp.src(['./src/**/*.js', '!./src/lib/**'])
        .pipe(jshint())
        // You can look into pretty reporters as well, but that's another story
        .pipe(jshint.reporter('default'));
});

gulp.task('css-lint', ['build:ent', 'build:components'], function() {
    return gulp.src(['./build/**/*.css', '!./build/lib/**/*.css'])
        .pipe(csslint())
        // You can look into pretty reporters as well, but that's another story
        .pipe(csslint.reporter());
});

/*
  Browserify task
*/
gulp.task('browserify', ['browserify:ent', 'browserify:components'], function(done){
    done();
});

/*
 Watching for changes to src files, and reloading the browser after any changes.
 */
gulp.task('watch', ['lint', 'browserify'], function() {
    // Running lint and browserify on JS src changes and deploying the changes.
    gulp.watch(['./src/**/*.js', './src/**/*.json', '!src/lib/**'],[
        'lint',
        'browserify'
    ]);
    // Deploying changes to HTML and CSS files

   // gulp.watch(['./src/**/*.html', './src/**/*.scss', '!src/lib/**'], [
        //'views:ent',
        //'views:components'
   // ]);
    // Reloading the browser when changes are deployed.
    gulp.watch('./build/**').on('change', livereload.changed);
});

/*
 Start local dev server
  */
gulp.task('dev', ['watch'], function() {
    // Start webserver
    require("../server").start(9000);  // Requiring the server only when needed because it requires services that start DB connections.
    // Start live reload
    livereload.listen();
});
pford68 commented 8 years ago

I copy from the resources directory, rather than generate.