Offers you a Yeoman generator to initiate a Web application with the following workflow:
Why generator-gulp-angularfire ?
This generator combines the best features of other generators like generator-gulp-angular, generator-angular, ngTailor and generator-gulp-webapp into an optimal workflow for starting applications with AngularJS powered by Gulp & Firebase!
generator-gulp-angularfire scaffolds an Angularfire application with a full-featured gulpfile.js, giving you immediate out-of-the-box access to all tasks for modern web development with Firebase.
Create your project
Install the required tools:
npm install -g yo gulp bower
npm install -g generator-gulp-angularfire
Make a new directory, and
cd into it:
mkdir my-new-project && cd $_
yo gulp-angularfire, optionally passing an app name:
yo gulp-angularfire [app-name]
Use Gulp tasks
gulp buildto build an optimized version of your application in
gulp serveto launch a browser sync server on your source files
gulp serve:distto launch a server on your optimized application
gulp wiredepto fill bower dependencies in your
gulp testto launch your unit tests with Karma
gulp protractorto launch your e2e tests with Protractor
gulp protractor:distto launch your e2e tests with Protractor on the dist files
But I recommend keeping to a division by file type: scripts, styles, partials.
Features included in the gulpfile
- useref : allow configuration of your files in comments of your HTML file
- ngMin : convert simple injection to complete syntax to be minification proof
- csso : optimize all your CSS
- rev : add a hash in the file names to prevent browser cache problems
- watch : watch your source files and recompile them automatically
- imagemin : all your images will be optimized at build
- Unit test (karma) : out of the box unit test configuration with karma
- e2e test (protractor) : out of the box e2e test configuration with protractor
- browser sync : full-featured development web server with livereload and devices sync
- ngHtml2js : all HTML partials will be converted to JS to be bundled in the application
- TODO lazy : don't process files which haven't changed when possible
Questions the generator will ask
- jQuery: jQuery 1.x, 2.x, Zepto, none
- Angular modules: animate, cookies, touch, sanitize
- Resource handler: ngResource, Restangular, none
- Router: ngRoute, UI Router, none
- UI Framework: Bootstrap, Foundation, none (depends on the chosen CSS preprocessor)
- TODO Bootstrap directives : UI Bootstrap, Angular Strap, none (only if you chose Bootstrap)
- TODO CSS preprocessor: less, sass, none
- TODO JS preprocessor: CoffeeScript, TypeScript, ECMAScript6 (Traceur)
- TODO HTML preprocessor: Jade ?
- TODO Script loader: Require, Browserify, ES6 with Require?, none
- TODO Test framework: Jasmine, Mocha, Qunit
Protractor tests are not stable with PhantomJS, at least not on my Mac. I'm getting unpredictable disconnections between webdriverjs and phantomjs.
I tried many configurations for Protractor without success, any hint would be appreciated.
- Improves scaffolded code.
- Initial commit
- Scaffolds a working Angularfire application
@Swiip and his generator-gulp-angular project.