Show Menu
Cheatography
  1. Home >
  2. Cheat Sheets >

Angular 8 Projects Cheat Sheet (DRAFT) by

This is a draft cheat sheet. It is a work in progress and is not finished yet.

Create Workspace

ng new [proje­ctname] --crea­te-­app­lic­ati­on=­false
For next commands: cd [proje­ctname]

Create applic­ation

ng generate applic­ation [appli­cat­ion­name]

Create Library

ng generate library [libra­ryname] --pref­ix=­[pr­efix]
ALWAYS: Use a prefix when generating a library.

Use library in applic­ation

Add to src\ap­p.m­odu­le.test
import { librar­yna­meM­odule } from 'libraryname';
add librar­yna­meM­odule in imports array
add to html-file
<pr­efi­x-l­ibr­ary­nam­e><­/pr­efi­x-l­ibr­ary­nam­e>
Before using a library: build the library: ng build [libraryname]
ALWAYS: In your test applic­ation import using your library by name and NOT the individual files.

Build, serve and test

build library
ng build [libra­ryname]
build applic­ation
ng build [appli­cat­ion­name]
serve applic­ation
ng serve [appli­cat­ion­name] --prod
test library
ng test [libra­ryname]
test applic­ation
ng test [appli­cat­ion­name]
Will be served on localh­ost­:4200
  

New components

generate
ng generate component [modul­ename] --proj­ect­=[l­ibr­ary­nam­e/a­ppl­ica­tio­nname]
add to .module.ts export array
if library

Angular material

add angular material
ng add @angul­ar/­mat­erial
Add components to src/ap­p/a­pp.m­od­ule.ts
import { MatInp­utM­odule, MatBut­ton­Module, MatSel­ect­Module, MatIco­nModule } from '@angular/material';
import { FormsM­odule } from '@angular/forms';

imports: [ Browse­rMo­dule, Browse­rAn­ima­tio­nsM­odule, FormsM­odule, MatInp­utM­odule, MatBut­ton­Module, MatSel­ect­Module, MatIco­nModule ],