Lots of fun things that can be done with gulp

gulpfile-ember.js

'use strict';

function camelCase(name) {
  name = name.split('-')
  if (name.length > 1) {
    for (let i=1; i<name.length; i++) {
      name[i] = name[i].charAt(0).toUpperCase() + name[i].slice(1)
    }
  }
  return name.join('')
}

const componentTypes = [
  'interaction',
  'layout',
  'theme',
  'visualization'
]

const argv = require('yargs')
  .usage('$0 <command> [options]')
  .command(['serve', '*'], 'Build and serve component library', {
    port: {
      describe: 'The server port to listen to',
      default: 3000,
      alias: 'p'
    }
  })
  .command('nvm', 'Switch to default version of node')
  .command('generate', 'Generate a new component', {
    name: {
      describe: 'Name for your new component',
      required: true,
      alias: 'n'
    },
    type: {
      choices: componentTypes,
      describe: 'The type of new component',
      required: true,
      alias: 't'
    }
  })
  .command('ember:generate', '', {
    name: {
      describe: 'Name of the component to generate',
      required: true,
      alias: 'n'
    },
  })
  .command('add:component:yui-docs', '', {
    name: {
      describe: 'Name of the component to modify',
      required: true,
      alias: 'n'
    },
  })
  .command('update:router:add', '', {
    name: {
      describe: 'Name of the component to add',
      required: true,
      alias: 'n'
    },
  })
  .command('update:routes:add', 'Add a component to the component library\'s routes', {
    name: {
      describe: 'Name of the component to add',
      required: true,
      alias: 'n'
    },
  })
  .command('add:component:style', 'Create a stylesheet for a component', {
    name: {
      describe: 'Name of the component we\'re adding the stylesheet for',
      required: true,
      alias: 'n'
    },
  })
  .command('add:component:documentation', 'Add component documentation to component library', {
    name: {
      describe: 'Name of the component we\'re adding documentation for',
      required: true,
      alias: 'n'
    },
  })
  .command('git:add', 'Add component\'s files to commit index', {
    name: {
      describe: 'Name of the component we\'re saving',
      required: true,
      alias: 'n'
    },
  })
  .command('git:status', 'Show git status for component files', {
    name: {
      describe: 'Name of the component we\'re working with',
      required: false,
      alias: 'n'
    },
  })
  .help('?')
  .epilog('(C) 2017 Samuel B Grundman')
  .argv

const gulp = require('gulp'),
  cli = require('gulp-run-command').default,
  colors = require('colors'),
  path = require('path'),
  fs = require('fs'),

plugins = {
  editJSON: require('gulp-json-editor'),
  newFile: require('gulp-file'),
  write: require('gulp-edit'),
  git: require('gulp-git'),
}

colors.setTheme({
  info: 'blue',
  error: 'red',
  warn: 'yellow'
})

gulp.task('nvm', cli('nvm use default'))

// Run `ember g component '${argv.name}'`
gulp.task('ember:generate', cli(`ember g component '${argv.name}'`))

// Add basic yui-docs comment code
gulp.task('add:component:yui-docs', () => {
  const camelCaseName = camelCase(argv.name)
  console.log('Created class ' + camelCaseName.magenta)
  const file = `addon/components/${argv.name}.js`
  return gulp.src(file)
    .pipe(plugins.write((src, cb) => {
      src = `/**
 *
 * @class ${camelCaseName}
 * @extends Ember Component
 */
${src}`
      cb(null, src)
    }))
    .pipe(gulp.dest(path.dirname(file)))
})

// TODO: Update tests/dummy/app/router.js
gulp.task('update:router:add', () => {
  console.log(('Don\'t forget to update ' + 'tests/dummy/app/router.js'.underline).red);

  return gulp.src('tests/dummy/app/router.js')
})

// TODO: Update tests/dummy/app/routes/application.js
gulp.task('update:routes:add', () => {
  console.log(('Don\'t forget to update ' + 'tests/dummy/app/routes/application.js'.underline).red);

  return gulp.src('tests/dummy/app/routes/application.js')
})

// Create addon/styles/components/${argv.name}.scss
gulp.task('add:component:style', gulp.parallel(
  cli(`touch addon/styles/components/${argv.name}.scss`),
  function importCSS() {
    const file = './addon/styles/addon.scss'
    return gulp.src(file)
      .pipe(plugins.write((src, cb) => {
        if (src[src.length-1] !== "\n") {
          src += "\n"
        }
        const str = `@import "components/${argv.name}";\n`
        // Import stylesheet only once
        if (src.indexOf(str) === -1) {
          src += str
        }
        cb(null, src)
      }))
      .pipe(gulp.dest(path.dirname(file)))
  }))

// Create tests/dummy/app/templates/${argv.type}/${argv.name}.hbs
gulp.task('add:component:documentation', () => {
  console.log('Adding documentation template…'.info)
  const camelCaseName = camelCase(argv.name)
  const str = `{{! ${argv.type}/${argv.name}.hbs}}
{{component-name name="${argv.name}"}}

{{#component-description label="Params"}}
  {{yui-params mod="${camelCaseName}"}}
{{/component-description}}

{{#component-example}}
  {{#${argv.name}}}
    ! The actual component
  {{/${argv.name}}}
{{/component-example}}

{{#component-code lang="htmlbars"}}
&#123;&#123;#${argv.name}&#125;&#125;
  An example of the syntax for the component
&#123;&#123;/${argv.name}&#125;&#125;
{{/component-code}}`
  return plugins.newFile(`${argv.name}.hbs`, str, { src: true })
    .pipe(gulp.dest(`./tests/dummy/app/templates/${argv.type}/`))
})

// Run everything we need for a new component
gulp.task('generate', gulp.series(
  'ember:generate',
  'add:component:yui-docs',
  'update:router:add',
  'update:routes:add',
  'add:component:style',
  'add:component:documentation'
))

gulp.task('git:add', () => {
  return gulp.src([
      `addon/components/${argv.name}.js`,
      `addon/templates/components/${argv.name}.hbs`,
      `tests/dummy/app/templates/{theme,layout,interaction,visualization}/${argv.name}.hbs`,
      `tests/integration/components/${argv.name}-test.js`,
      `app/components/${argv.name}.js`,
      `tests/dummy/app/router.js`,
      `tests/dummy/app/routes/application.js`,
      `addon/styles/addon.scss`,
      `addon/styles/components/${argv.name}.scss`
    ])
    .pipe(plugins.git.add())
})

gulp.task('git:pull', () => {
})

gulp.task('git:push', () => {
})

gulp.task('git:status', (done) => {
  if (!argv.name) {
    argv.name = '**'
  }
  plugins.git.status({
    args: '-- ' + [
      `addon/components/${argv.name}.js`,
      `addon/templates/components/${argv.name}.hbs`,
      `tests/dummy/app/templates/theme/${argv.name}.hbs`,
      `tests/dummy/app/templates/layout/${argv.name}.hbs`,
      `tests/dummy/app/templates/interaction/${argv.name}.hbs`,
      `tests/dummy/app/templates/visualization/${argv.name}.hbs`,
      `tests/integration/components/${argv.name}-test.js`,
      `app/components/${argv.name}.js`,
      `tests/dummy/app/router.js`,
      `tests/dummy/app/routes/application.js`,
      `addon/styles/addon.scss`,
      `addon/styles/components/${argv.name}.scss`
    ].join(' ')
  })
  done()
})

gulp.task('serve', cli([
  'ember ember-cli-yuidoc',
  `ember s --port ${argv.port}`
]))

gulp.task('default', gulp.series(
  'nvm',
  'serve'
))

gulpfile.js

'use strict';

const gulp = require('gulp');

const concat = require('gulp-concat');
const header = require('gulp-header');
const sass = require('gulp-sass');
const autoprefixer = require('gulp-autoprefixer');
const sassOptions = {
  outputStyle: 'compressed'
};

gulp.task('concat', () => {
  return gulp.src([
    '**/*.{,s}css'
  ])
    .pipe(sass(sassOptions))
    .pipe(header((function(){
      let str = "/**\n"
      // properties found at https://github.com/gulpjs/vinyl
      str += ` * <%= file.relative %>\n`
      str += " */\n"
      return str
    })()))
    .pipe(autoprefixer({
      // more options at https://github.com/postcss/autoprefixer#options
      browsers: [
        // browser strings detailed at https://github.com/ai/browserslist#queries
        'last 2 versions',
        'Safari >= 8',
        'not ie < 11',
        'not ie_mob < 11'
      ],
      cascade: false
    }))
    .pipe(concat('min.css'))
    .pipe(gulp.dest('.'))
});

const filterUpdatedFiles = require('gulp-changed');
const rmLines = require('gulp-delete-lines');
const minifyJS = require('gulp-babel');
const string = require('gulp-change');
const ignore = require('gulp-ignore');
const mv = require('gulp-rename');
const git = require('gulp-git');

const options = {
	filterUpdatedFiles:{
		cwd: __dirname
	},
	ignore: '*.min.js',
	minifyJS:{
		comments:false,
		presets: [
			'babili'
		],
		plugins: [
			'transform-remove-console'
		]
	},
	git:{
	}
}

gulp.task('minify', () => {
	// Minify JavaScript Files
	return gulp.src('www/**/*.js')
		// Ignore minified files
		.pipe(ignore(options.ignore))
		// Minify only updated files
		.pipe(filterUpdatedFiles('dist/'), options.filterUpdatedFiles)
		// Minify!
		.pipe(minifyJS(options.minifyJS))
		// Save in dist(rubutable) directory
		.pipe(gulp.dest('dist/'))
});

gulp.task('update:pokedex', () => {
	// Update Git Submodules
	return git.updateSubmodule({args: '--remote --merge'}, () => {
		// Update moves.csv
		gulp.src('pokedex/pokedex/data/csv/moves.csv')
			// Remove Non-canon Moves
			.pipe(rmLines({'filters':[
				/^10\d{3},/
			]}))
			.pipe(string((str) => {
				str = str.split("\n");
				// Remove Contest Information
				str = str.map((s, i) => {
					return s.replace(/(,[^,]*){3}$/g, '')
				})
				return str.join("\n");
			}))
			.pipe(gulp.dest('www/pokédex/csv/'));
		// Update Pokémon Moves Dataset
		gulp.src('pokedex/pokedex/data/csv/pokemon_moves.csv')
			// Remove Non-canon Versions
			.pipe(rmLines({'filters':[
				/^\d+,(12|13),/
			]}))
			// Remove Non-normative Pokémon
			.pipe(rmLines({'filters':[
				/^10\d{3},/
			]}))
			.pipe(string((str) => {
				str = str.split("\n");
				// Remove order Column
				str = str.map((s) => {
					return s.replace(/,[^,]*$/g, '')
				})
				return str.join("\n");
			}))
			.pipe(mv({basename:'pkmn_moves'}))
			.pipe(gulp.dest('www/pokédex/csv/'));
	})
	// TODO: Update and rehash Pokédex files
//	return gulp.src('pokédex/pokedex/data/csv/*.csv')
});

gulp.task('default', gulp.series('minify'));

gulpfile2.js

const gulp = require('gulp');
const babel = require('gulp-babel');
const sass = require('gulp-sass');
const concat = require('gulp-concat');
const sourcemaps = require('gulp-sourcemaps');
const server = require('gulp-live-server');

const options = {
	sass: {
		"outputStyle": "compressed"
	},
	concat: {
		css: {
			path: 'min.css'
		},
		js: {
			path: 'min.js'
		}
	}
}

// Copy HTML files to docs folder
gulp.task('compile:html', function() {
	return gulp.src('./src/**/*.html')
		.pipe(gulp.dest('docs/'));
});

// Transpile and minify JavaScript files
gulp.task('compile:js', function() {
	return gulp.src([
		'./src/**/*.js',
		'!./node_modules'
	])
		.pipe(sourcemaps.init())
			.pipe(babel())
			.pipe(concat(options.concat.js))
		.pipe(sourcemaps.write())
		.pipe(gulp.dest('docs/'));
});

// Transpile and minify SCSS files
gulp.task('compile:sass', function() {
	return gulp.src('./src/**/*.s{a,c}ss')
		.pipe(sourcemaps.init())
			.pipe(sass(options.sass))
			.pipe(concat(options.concat.css))
		.pipe(sourcemaps.write())
		.pipe(gulp.dest('docs/'));
});

// Compile files and start server
gulp.task('default', 
	gulp.series(
		gulp.parallel('compile:js', 'compile:html', 'compile:sass'),
		function() {

//server.static('docs', 3000);

//			server.new('server.js');
//			server.start();

			// Error: second argument must be a function?!
//			gulp.watch(['src/**/*.html'], 'compile:html');

			gulp.watch(['src/**/*.html'], gulp.series(
				'compile:html'
			));

			gulp.watch(['src/**/*.{sa,sc,c}ss'], gulp.series(
				'compile:sass'
			));

			gulp.watch(['src/**/*.js'], gulp.series(
				'compile:js'
			));

			gulp.watch(['docs/**/*'], () => {
				console.log('notifying server');
				server.notify.apply(server);
			});

//			gulp.watch('server.js', server.start.bind(server));
		}
	)
);