README
generator-angular-with-require 
A generator for Yeoman.
Getting Started
To run this version of yeoman generator. First, make sure that you have already installed yeoman
$ npm install -g yo
To install generator-angular-with-require from npm, run:
$ npm install -g generator-angular-with-require
Finally, initiate the generator:
$ yo angular-with-require
Other dependencies
[Phantom.js] (http://phantomjs.org/) - You can change this in the config/karma.config.js by changing browsers tag
[Bower] (http://bower.io/)
[Grunt] (http://gruntjs.com/)
SASS (gem install sass)
Compass (gem install compass)
Structure
New structure is based on [ng-boilerplate] (https://github.com/ngbp/ngbp) but optimized with requirejs.
application/
|- app/
| |- bower_components/
| | |- <third libraries>
| |- images/
| | |- <image files>
| |- src/
| | |- config.js
| | |- main.js
| | |- <codeModule>/
| | | |- codeModule.js
| | | |- codeModule.spec.js
| | | |- codeModule.tpl.html
| |- style/
| | |- _custom_mixins.scss
| | |- style.scss
| | |- <other css files> - just copy other css files into this folder and
| | |- rerun `grunt serve` task to automatically concat css files
| |- 404.html
| |- favicon.ico
| |- index.html
| |- robots.txt
|- config/
| |- e2e.config.js
| |- karma.config.js
|- dist/
| |- <build>
|- node_modules/
| |- <node module code>
|- test/
| |- e2eSpecs
| | |- page.e2espec.js
| | |- <other e2e specs>
|- bower.json
|- Gruntfile.js
|- package.json
Old structure for revision v0.2.*
application/
|- app/
| |- bower_components/
| | |- <third libraries>
| |- images/
| | |- <image files>
| |- scripts/
| | |- config.js
| | |- main.js
| | |- controllers/
| | | |- controllers.js
| | |- services/
| | | |- services.js
| | |- directives/
| | | |- directives.js
| | |- filters/
| | | |- filters.js
| |- style/
| | |- _custom_mixins.scss
| | |- style.scss
| | |- <other css files> - just copy other css files into this folder and
| | |- rerun `grunt serve` task to automatically concat css files
| |- 404.html
| |- favicon.ico
| |- index.html
| |- robots.txt
|- config/
| |- e2e.config.js
| |- karma.config.js
|- dist/
| |- <build>
|- node_modules/
| |- <node module code>
|- test/
| |- e2eSpecs
| | |- page.e2espec.js
| | |- <other e2e specs>
| |- specs/
| | |- <specs files>
| |- helpers/
| | |- <helper file for specs>
| |- test-main.js
|- bower.json
|- Gruntfile.js
|- package.json
Usage
The version of generator uses SASS Bootstrap as its main theme. If you want to use Compass framework, make sure that you view their docs to know what to include Compass.
For other css libraries from app/bower_components, copy them into app/styles, and it will automatically concat into style.css file
To run the serve, and start building your application
$ grunt serve
It will automatically open the webpage on your localhost:9000, or you will have to do it manually
To run test
$ grunt karma:unit
To run e2e test. This requires selenium browser and chromedriver. Make sure you view [angular/protractor] (https://github.com/angular/protractor)
Setup protractor and seleium browser
$ npm install -g protractor
$ webdriver-manager update
Run actual e2e test
$ grunt shell:protractor # require you to run `grunt serve` first
To build files for production
$ grunt build
This also supports for subgenerator for controller, filter, service, and directive as well. Make sure you link them in your main.js
$ yo angular-with-require:controller "name" #replace the name with your module name
$ yo angular-with-require:service "name" #replace the name with your module name
$ yo angular-with-require:directive "name" #replace the name with your module name
$ yo angular-with-require:filter "name" #replace the name with your module name
The subgenerator will automatically create link in your app/src/config.js file with the name of the module. Additionally, it will automatically copy all configurations for paths and shim into test/test-main.js
To manually copy requirejs config to test/test-main.js, run:
$ grunt requirejs-config-copy # this is only required when testing without `grunt serve`