UI Dev And Build

Setup the development environment

You need to set up your development environment before you can do anything.

Install Node.js® and npm if they are not already on your machine.

Verify that you are running at least node 6.9.x and npm 3.x.x by running node -v and npm -v in a terminal/console window. Older versions produce errors, but newer versions are fine.

Then install the Angular CLI globally. You can install angular cli using npm:

npm install -g @angular/[email protected]

Then install Bower globally. You can install Bower using npm:

npm install -g bower

Great, your base setup is done!

Setup Web app

If you are doing this setup, menas you have already cloned the repository.

Go to webapp folder from your terminal/console and run the following commands to install node and bower modules

npm install
bower install

Yay! you are good to start the application.

Before we proceed to running the application, one last check, look at the application configuration and ensure required configurations have values, optional configuration can be skipped for now.

Check the details about each configuration value here

Let's start the application!

Development server

Run ng serve for a dev server. Navigate to http://localhost:4200/. The app will automatically reload if you change any of the source files.

Build

Run ng build --env={{environment}} --output-hashing=all to build the project. The build artifacts will be stored in the dist/ directory.

environment in above coomand could take dev/stg/prod. These values belong to different environment files: dev corresponds to environment.ts stgcorresponds to environment.stg.ts prod corresponds to environment.prod.ts

Running end-to-end tests

Run ng e2e to execute the end-to-end tests via Protractor.

Code scaffolding

Run ng generate component component-name to generate a new component. You can also use ng generate directive|pipe|service|class|guard|interface|enum|module.