Yeoman generator for creating cordova applications, using AngularJS and ngCordova. End to end testing is now possible thanks to ngCordovaMocks. Have Fun!
Yeoman - sudo npm install -g yo
Cordova CLI - sudo npm install -g cordova
Install generator-angular-mobile
:
npm install -g generator-angular-mobile
Make a new directory, and cd
into it:
mkdir my-new-project && cd $_
Run yo angular-mobile
, optionally passing an app name:
yo angular-mobile [app-name]
Run grunt serve
for preview of the app in browser.
A grunt task looks for new files in your www/app
and www/components
folder and automatically injects them in the appropriate places based on an injection block.
-
user prompts on project scaffold
- markup
- stylesheet
- framework? (bootstrap/ionic)
- mobile platforms
- initial cordova plugins
-
grunt serve:dist
- cordova cli commands
- bower clean up
- move generated apk etc to dist
-
e2e
- ???
Available generators:
- App
Sets up a new AngularJS + Express app, generating all the boilerplate you need to get started.
Example:
yo angular-mobile
Generates a new route.
Example:
yo angular-mobile:route myroute
[?] Where would you like to create this route? www/app/
[?] What will the url of your route be? /myroute
Produces:
www/app/myroute/myroute.js
www/app/myroute/myroute.controller.js
www/app/myroute/myroute.controller.spec.js
www/app/myroute/myroute.html
www/app/myroute/myroute.css
Generates a controller.
Example:
yo angular-mobile:controller user
[?] Where would you like to create this controller? www/app/
Produces:
www/app/user/user.controller.js
www/app/user/user.controller.spec.js
Generates a directive.
Example:
yo angular-mobile:directive myDirective
[?] Where would you like to create this directive? www/app/
[?] Does this directive need an external html file? Yes
Produces:
www/app/myDirective/myDirective.directive.js
www/app/myDirective/myDirective.directive.spec.js
www/app/myDirective/myDirective.html
www/app/myDirective/myDirective.css
Simple directive without an html file
Example:
yo angular-mobile:directive simple
[?] Where would you like to create this directive? www/app/
[?] Does this directive need an external html file? No
Produces:
www/app/simple/simple.directive.js
www/app/simple/simple.directive.spec.js
Generates a filter.
Example:
yo angular-mobile:filter myFilter
[?] Where would you like to create this filter? www/app/
Produces:
www/app/myFilter/myFilter.filter.js
www/app/myFilter/myFilter.filter.spec.js
Generates an AngularJS service.
Example:
yo angular-mobile:service myService
[?] Where would you like to create this service? www/app/
Produces:
www/app/myService/myService.service.js
www/app/myService/myService.service.spec.js
You can also do yo angular-mobile:factory
and yo angular-mobile:provider
for other types of services.
Generates an AngularJS service decorator.
Example:
yo angular-mobile:decorator serviceName
[?] Where would you like to create this decorator? www/app/
Produces
www/app/serviceName/serviceName.decorator.js
The following packages are always installed by the app generator:
- angular
- angular-cookies
- angular-mocks
- angular-resource
- angular-sanitize
- angular-scenario
- es5-shim
- json3
- jquery
- lodash
These packages are installed optionally depending on your configuration:
- angular-route
- angular-ui-router
All of these can be updated with bower update
as new versions are released.
Yeoman generated projects can be further tweaked according to your needs by modifying project files appropriately.
A .yo-rc
file is generated for helping you copy configuration across projects, and to allow you to keep track of your settings. You can change this as you see fit.
Running grunt test
will run the unit and e2e unit tests with karma and jasmine.
Use grunt test:e2e
to only run e2e tests.
Use grunt test:unit
to only run unit tests.
Protractor tests
To setup protractor e2e tests, you must first run
npm run update-webdriver