tjbenton

I've used gulp for awhile now and It's also pretty easy. With fly you don't have to repeat your self several times like you do with gulp tasks. You just define out what you want and that's it. If it's a fly plugin it will be required automatically without the need for an additional plugin. You can also run multiple subtasks in the same task in order without having to create a separate task.

This could be the only thing in your flyfile.js and it would run perfectly. This will clear the previous JS, convert all the ES6 files to ES5 with babel, combine all the files, minify the combined file and output the file and the sourcemaps to the dist js directory.

3 total plugins require including fly it's self , 0 plugins that had to be required in the flyfile.js, 1 task

// flyfile.js
export function *js(){
 yield this.clear("dist/lib/js");

tjbenton

<main>
  <section>
    <h1>Section</h1>
    <h3>Lorem ipsum dolor sit amet</h3>
    <p>Consectetur adipisicing elit. Itaque omnis quisquam aut, adipisci molestiae odit ut dolorem voluptas minima molestias natus iusto dolorum inventore eaque error possimus nobis laboriosam cupiditate!</p>
    <h3>Lorem ipsum dolor sit amet</h3>
    <p>Consectetur adipisicing elit. Itaque omnis quisquam aut, adipisci molestiae odit ut dolorem voluptas minima molestias natus iusto dolorum inventore eaque error possimus nobis laboriosam cupiditate!</p>
    <h3>Lorem ipsum dolor sit amet</h3>
    <p>Consectetur adipisicing elit. Itaque omnis quisquam aut, adipisci molestiae odit ut dolorem voluptas minima molestias natus iusto dolorum inventore eaque error possimus nobis laboriosam cupiditate!</p>
    <h3>Lorem ipsum dolor sit amet</h3>

tjbenton

/// @name has_events
/// @author Tyler Benton
/// @description
/// Utility to list out elements that have event listeners. Their listeners will be listed out in the console.
/// @arg {string} target ["*"]
/// @note {10} - Only works if you copy this code and paste it in the chrome console.
/// @markup {js}
/// has_events(); // lists out all elements
/// has_events("a"); // lists out all anchor tags that have event listeners
function has_events(target){

tjbenton

// ----
// libsass (v3.2.5)
// ----

$animations: (); // global placeholder to store a list of animations that have been used

// @author Tyler Benton
// @description
// This is used in an attempt to prevent unused `@keyframes` 
//from being compiled unless they're actually used

tjbenton

// ----
// Sass (v3.4.14)
// Compass (v1.0.3)
// ----

%keyframes{
  &--pulse{
    @keyframes pulse{
      0%{
        left: 0;

tjbenton

<div class="no-js">
  <ul class="c-cards c-cards--rounded">
  <li class="c-cards__card"></li>
  <li class="c-cards__card"></li>
  <li class="c-cards__card"></li>
 </ul>
</div>

tjbenton

<div class="no-js">
  <ul class="c-cards c-cards--rounded">
  <li class="c-cards__card"></li>
  <li class="c-cards__card"></li>
  <li class="c-cards__card"></li>
 </ul>
</div>

tjbenton

# found in http://stackoverflow.com/questions/750172/change-the-author-of-a-commit-in-git#answer-870367
# you may get errors
# if so just use `--force`
git filter-branch --env-filter '
if [ "$GIT_COMMITTER_NAME" = "<Old name>" ]; then
 GIT_COMMITTER_NAME="<New name>";
 GIT_COMMITTER_EMAIL="<New email>";
 GIT_AUTHOR_NAME="<New name>";
 GIT_AUTHOR_EMAIL="<New email>";
fi' -- --all

tjbenton

/*! normalize.css v2.1.3 | MIT License | git.io/normalize */

/* ==========================================================================
   HTML5 display definitions
   ========================================================================== */

/**
 * Correct `block` display not defined in IE 8/9.
 */

tjbenton

// @name Include
// @author Tyler Benton
// 
// @description
// This function allows you to concatenate file paths together so that you can use them in a `gulp.src`
// Using this method instead of `gulp-include` allows you to generate sourcemaps to make it easier to debug issues.
// 
// @arg {string} path - The path for the file you want to look in
// 
// @returns {array} - The array of file paths