Skip to content

Gulp

Jump to bottom Edit New page
Alex Gian edited this page Mar 19, 2015 · 9 revisions

Gulp

script for automating tasks such as builds and testing

Main Commands

gulp

  • this command starts the application and mongodb for localhost
  • this command handles auto refreshing of the webpage if a developer makes a changes to a file
  • dependencies ['browser-sync']

gulp test

  • this command runs the karma test for the current application

gulp stage

  • this command deploys the code from your local branch into one of three staging environments [1,2,3], after running unit tests
  • this command takes an optional --test stage_number_here flag from which a specific environment can be deployed. With no arguments this command will always default to the first staging environment.
  • NOTE: there are important prerequisites to this command working
    • you must run heroku login and be authenticated first
    • you must be authenticated within git and be able to push without manually entering username/password
    • you must have committed your code first
    • you must be in your application root directory

gulp mongodump

  • this command backups the current local mongodb database in a dump folder
  • NOTE: there are important prerequisites to this command working
    • you must have mongodb currently running (gulp does meet prereq. since db is auto started)

gulp mongorestore

  • this command restores the current local mongodb database from the dump folder
  • NOTE: there are important prerequisites to this command working
    • you must have mongodb currently running (gulp does meet prereq. since db is auto started)

gulp build and gulp build-concat

  • All together (What you actually need to do):
    • gulp build - create a build folder where holds all the minified version of each file
      • all javascript files from the ./public/javascripts directory will be minified into ./build
        • example.js will become example.min.js in build directory
      • all stylesheet files from the ./public/stylesheets directory will be minified into ./build
        • example.css will become example.min.css in build directory
    • gulp build-concat - create a build folder where holds all the concat and minified version of each file
      • same as gulp build but files will be stored in concat directory under build
      • all javascript files will become one file called vendor.js and the minified version vendor.min.js

Helper Commands

gulp nodemon

  • this helper task starts an application instance which reboots upon detecting any changes in the server-side/front-end javascript code. Runs simultaneously with the browser-sync task described below.

gulp browser-sync

  • this helper task watches the front-end HTML/CSS files and refreshes the web-page immediately upon any changes, without restarting the server.

gulp mongostart

  • this helper method is basically mongod --dbpath db
  • NOTE: there are important prerequisites to this command working
    • you must have db folder

gulp mongoend

  • this helper method is basically mongo --eval 'db.shutdownServer()' admin
  • NOTE: there are important prerequisites to this command working
    • you must have db folder

gulp checkLocal

  • this helper task watches for JavaScript and HTML files changes and checks basic functions and standards

gulp checkDev

  • this helper task checks development for similar standards as checkLocal

gulp checkProd

  • this helper task checks production for similar standards as checkLocal

gulp-util - adds functionality for logging and coloring console output. etc.

gulp-clean - clean up the folder that you want to remove for testing purpose

gulp-concat - tool that helps to combine multiple javascript files into one file (useful when no function conflicts)

gulp-uglify - tool to make the file without any line break in order to minimize the file size (improve network transfer).

gulp-rename - tool to rename a minified version of file in order to keep both source and result files

gulp-minify-css - tool to minify css files in order to minimize the file size (improve network transfer).

gulp-jshint - tool that helps detect bugs in JavaScript code and helps in error handling

check-pages - plugin that has options to check web application for working links and resources

gulp-load-plugins - tool that helps minify the lines of dependencies and loads the dependencies from the package.json

Documentation Commands

gulp apidoc

  • Generates a folder in the root with the documentation in the code. To learn more about syntax apidocjs

gulp doc-deploy

  • Similar to gulp apidoc but also deploys to gh-pages.
Add a custom footer
Add a custom sidebar
Clone this wiki locally