a set of Gulp tasks for developing and deploying JS apps.
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.


bendystraw NPM version


bendystraw is an opinionated set of [Gulp](https://github.com/gulpjs/gulp/) tasks for developing and deploying javascript apps

Some features include Babel & CoffeeScript support, Angular specific features, Browersync development, multiple app environments, GitHub changelog and release creation, AWS deployment, Slack integration, and more.


npm install --save-dev bendystraw

In order to use the gulp tasks, create a gulpfile.js with:



bendystraw assumes you have a defined source folder to use the tasks. By default, it looks like this:


You can generate this structure by using gulp scaffold, or you can override it to fit your needs. Here's an example configuration:

// gulpfile.js
  paths: {
    build: 'public', // Override the build folder name
    styles: 'css', // Override the stylesheet source folder
  html: {
    preprocessor: require('gulp-jade'), // Use a custom html preprocessor
  styles: {
    sassOptions: {
      indentedSyntax: true // Use .sass indented syntax
    uncss: true, // Enable uncss
    autoprefixer: true
  scripts: {
    babel: true, // Use babel es2015 preset
    coffeescript: false,
    sourcemaps: false

Check out all the config values here

NOTE: gulp scaffold will generate an index.html file. This shows how bendystraw uses gulp-inject and gulp-useref to inject your app's javascript and create bundles. Make sure to change the paths in the file if you've overridden the defaults. Read more about it on the wiki.


command description
gulp defaults to server task
gulp server builds the app to the dev folder and runs the Browsersync server
gulp build builds, minifys the app to the build folder (for production)
gulp release bumps version, tags, and creates a GitHub release based on your package.json
gulp deploy deploys the build folder to a S3 bucket, posts to Slack if configured
gulp lint lints using sass-lint, eslint, and coffeelint
gulp test runs tests using Karma
gulp e2e runs end to end tests with Protractor

bendystraw uses dotenv to load environment variables into the app. All of these tasks can be run with --env, ie: gulp build --env staging. This will make .env.staging available to the app.

To read more about the tasks and environment, check out the wiki.


  • JS:
    • Angular features (off by default)
      • Dependency injection annotations
      • File sorting to avoid injection issues
      • Compiles html files to the Angular templateCache
    • Babel es2015 support
    • CoffeeScript support
    • CoffeeLint/ESLint
    • Sourcemaps
    • Bower components automatically injected through wiredep
    • Multiple script bundles created with useref
  • CSS:
    • Sass support, indented or scss using node-sass
    • Sourcemaps
    • Autoprefixer
    • SassLint
    • Uncss
  • HTML:
    • Any gulp-based html preprocessor support (gulp-haml, gulp-jade, etc)
  • Images:
    • Image compression
    • Grabs images from specified Bower components
  • Development:
    • Live reload with Browsersync
    • Support for multiple environments through dotenv
    • dotenv configuration output to window global or Angular constant for injection
    • Environment specific logic in the views
  • Releasing:
    • GitHub semantic tagging and release creation (based on your package.json)
    • Changelog generation by comparing previous tag
  • Deployment:
    • Amazon S3 bucket deploys
    • Asset revisioning
    • Cloudfront CDN url replacement support
    • Slack deployment messages
  • Testing:
    • Karma tests
    • End to end testing with Protractor


bendystraw is inspired and based off of several Gulp projects. Big thanks to gulp-starter by vigetlabs and generator-gulp-angular by Matthieu Lux