Giter Club home page Giter Club logo

heroku-buildpack-nodejs-bower-gulp's Introduction

Heroku Buildpack for Node.js, Bower, and Gulp

Usage

  • Create a new app using heroku create --buildpack=https://github.com/robgraeber/heroku-buildpack-nodejs-bower-gulp.git. To be safe, you should fork this and use your fork's URL.
  • Add a Gulp task that builds your app. By default, the buildpack will call gulp build.
  • To specify your own task: Run heroku config:set GULP_TASK=build (Or any other name).
  • Add a bower.json/.bowerrc file that will be used with bower install. Packages not in bower.jsonare pruned each build.
  • And additionally, the buildpack has a few extra entry points. It will look for entry points in the following order:
  • Procfile: e.g. web: node server.js.
  • npm start script.
  • server.js file.
  • app.js file.

Note: It will only use bower/gulp if bower.json or gulpfile.js is found. Otherwise it's usable the same as other Node.js buildpacks, except with extra entry points.

Things That Will Happen

When the buildpack runs it will do many things similarly to the standard Heroku buildpack. In addition it will do the following things, in roughly this order.

  • If bower.json is found
    • Extract the directory key from .bowerrc if that is present
    • Run npm install bower to install bower locally
    • Run bower install to install bower_components.
    • Cache bower_components or whichever alternate directory was specified in .bowerrc
  • If gulpfile.js is found
    • Run npm install gulp to install gulp locally during the build
    • Run gulp build to build the app
  • If Procfile is not found
    • Looks for a npm start script
    • Then for a server.js file
    • And then for an app.js file

The bower component caching is very similar to the node_modules caching done for npm. The cache is restored before each build and bower prune is run to remove anything no longer needed before doing the bower install. This is the same way the standard buildpack handles caching.

Bonus: Also installs the latest npm + 'nasm' which is a dependency for imageMin.

Some Useful Aliases

I also like to create some useful aliases that help me deploy in 1-line. (Add the following to your .bash_profile):

heroku-push() {
  git push heroku master $1 $2 $3
  heroku open
}
heroku-delete() {
  heroku apps:destroy -a $1 --confirm $1
}
heroku-auto-create() {
  heroku create $1 $2 $3 --buildpack=https://github.com/robgraeber/heroku-buildpack-nodejs-bower-gulp.git
  heroku-push
}
alias heroku-create='heroku create --stack cedar-14 --buildpack=https://github.com/robgraeber/heroku-buildpack-nodejs-bower-gulp.git'
alias heroku-portal='open https://dashboard.heroku.com/apps'
alias heroku-set='heroku config:set'
alias heroku-rebuild='heroku repo:rebuild'
alias heroku-logs='heroku logs --tail'

Example: Type "heroku-auto-create myAppNameHere" to auto deploy in 1 line.

Credits

Forked from heroku-buildpack-nodejs-gulp.

Which was forked from heroku-buildpack-nodejs.

Heavily based on heroku-buildpack-nodejs-grunt.

heroku-buildpack-nodejs-bower-gulp's People

Contributors

btubbs avatar cbartlett avatar cleishm avatar davidjrice avatar ddollar avatar dzuelke avatar hone avatar jacobwgillespie avatar jclem avatar lackac avatar mmcgrana avatar robgraeber avatar ryanbrainard avatar rykov avatar timdp avatar timshadel avatar tomseago avatar zbuc avatar zeke avatar

Stargazers

 avatar

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.