This is a project template for Angular JS applications using Lineman.
It includes the following features:
- Template Precompilation into Angulars $templateCache using
grunt-angular-templates
- A basic login, logout service bound to sample routes inside
config/server.js
- A router, and 2 views
home
andlogin
- A directive that shows a message on mouseover
- 2 Controllers, for
home
andlogin
, with $scope variables set and bound - A working, bound login form (username/password don't matter, but are required)
- Configured grunt-ng-annotate so you don't have to fully qualify angular dependencies.
- Auto generated sourcemaps with inlined sources via grunt-concat-sourcemap (you'll need to enable sourcemaps in Firefox/Chrome to see this)
- Unit Tests and End-to-End Tests
- Configuration to run Protractor for End-to-End Tests
git clone https://github.com/linemanjs/lineman-angular-template.git my-lineman-app
cd my-lineman-app
sudo npm install -g lineman
npm install
lineman run
- open your web browser to localhost:8000
This template was used as the basis of @davemo's Testing Strategies for Angular JS screencast, and contains all the tests we wrote in the screencast and a few more!
To run the unit tests:
lineman run
from 1 terminal windowlineman spec
from another terminal window, this will launch Testem and execute specs in Chrome
To run the end-to-end tests:
npm install protractor
./node_modules/protractor/bin/webdriver-manager update
- Make sure you have chrome installed.
lineman run
from 1 terminal windowlineman grunt spec-e2e
from another terminal window
If you are using Coffeescript to define the angular.module for your app, you will need to swap the concat order in config/application.js
such that coffeescript files are included before javascript. (If you are using JavaScript for defining the angular.module the default concat order is fine).
Add the following concat_sourcemap
block to config/application.js
if you want to define your app module in coffeescript:
module.exports = function(lineman) {
return {
concat_sourcemap: {
js: {
src: [
"<%= files.js.vendor %>",
"<%= files.coffee.generated %>",
"<%= files.js.app %>",
"<%= files.ngtemplates.dest %>"
]
}
}
};
};
Hopefully this helps you get up and running with AngularJS!