# Installation and set up

## prerequisites
1. Nodejs > 6.5
2. Git

## steps
1. npm install aurelia-cli -g
2. npm install
3. ~~copy built assets folder from responsive-web to assets~~
4. au run --watch
5. au test

## build details
The build creates web-platform.js in the assets/js folder

## commands

### `au run`
Runs the build process, then starts a local dev server on port 9000 i.e. http://localhost:9000/
* Add flag `--js` to only rebuild javascript and markup when developing. This speeds up the rebuild.
* ~~Add flag `--alan` to only rebuild css, assets and markup when developing. This speeds up the rebuild.~~
* Add flag `--dev` to only transpile js and process markup without linting when developing. This speeds up the rebuild.  Run a full build before committing.
* Add flag `--docs` to only build the markdown files. This speeds up the documentation.  

Run a full build before committing.

### `au run --watch`
Same as `au run`, but will rebuild when code changes
See `au run` task for `--js` and `--docs` and `--dev` flags

### `au run --watch --use-test-server`
Same as `au run --watch --use-test-server`, but will use test server data
Type `au help run` for more details

### `au build`
Runs the build process. This includes linting, processing, transpiling and bundling, but not tests
See `au run` task for `--js` and `--docs` and `--dev` flags

### `au test`
Runs ALL test suites (*.spec.js files).
~~Append a spec filename to this command to run that suite only e.g. `au test src\components\products\common\elements\ft-footnote.spec.js`~~

### `au test --ui`
Runs test suites for UI components using Jasmine and Karma. This will open and close a browser window while running tests.
~~Append a spec filename to this command to run that suite only e.g. `au test src\components\products\common\elements\ft-footnote.spec.js --ui`~~
NB: Doesn't run the Business Logic (reducer) test suites.

### `au test --bl`
Runs test suites for Business Logic JS files (reducers, value-converters etc) using Jest.
~~Append a spec filename to this command to run that suite only e.g. `au test --bl src\components\products\distributions\ft-distributions\lib\en-us-retail\distribution-rate.spec.js`~~
NB: These tests run very fast, as they only use NodeJS.

### `au lint-css`
Lints all `scss` files within `src` folder using http://stylelint.io/
Configuration is based on [stylelint-config-standard](https://github.com/stylelint/stylelint-config-standard) with custom configuration in `.stylelintrc` file

### `au lint-js`
Uses [ESLint](http://eslint.org/) to lint all `.js` files within `src` and `test` folders.
Configuration is on '.eslintrc' and based on the Aurelia eslint configuration.

### `au lint-markup`
Lints html files using [gulp-lintspaces](https://www.npmjs.com/package/gulp-lintspaces)
All this really lints is whitespace and indentation, but at the moment there aren't any suitable html snippet linters.

### `au process-assets`
At present, this just copies the bootstrap fonts from the `node_modules` folder to `assets`.
In future it will likely copy more font and image files as part of the build.

### `au process-css`
This applies the following to the scss files in the `src` folder:
* runs the `lint-css` task
* compiles the sass into css
* applies [autoprefixer](https://github.com/postcss/autoprefixer) via [postcss](https://github.com/postcss/postcss)
* minifies the css via [cssnano](http://cssnano.co/)
* generates css sourcemaps
* saves the css files and sourcemaps to the `assets` folder

### `au process-markup`
This just applies the `lint-markup` task, before passing the markup off to the bundler

### `au generate redux-component`
This is used to generate a redux component or sub-component. Tests, documentation, sass and (optionally) reducer files are also generated. See `lib/redux-component-base.md` for more details.

### `au proxy-server`
This is used to test the dev assets against the live or dev site.

Example proxying live site with dev css assets

au proxy-server --proxy-target http://rcovlnx0188:8202 --dev-css-assets-server http://pattern-library.corp.frk.com/

Example proxying dev site with dev css assets

au proxy-server --dev-css-assets-server http://pattern-library.corp.frk.com/

Example proxying live site with dev js assets, and aurelia etf config

au proxy-server --override-aurelia-config configuration/etf/main --dev-js-assets-server http://localhost:9000/