```` $ npm i --save ts-md5@1.2.7 $ npm i --save ngx-pipes@2.7.3 $ npm i --save ngx-webstorage@4.0.2 $ npm i --save faunadb@2.13.0 $ npm i --save firebase@7.10.0 $ npm i --save @angular/fire@5.4.2 $ npm i --save chart.js@2.9.3 $ npm i --save ng2-ch
npm install ao-angular
$ npm i --save ts-md5@1.2.7
$ npm i --save ngx-pipes@2.7.3
$ npm i --save ngx-webstorage@4.0.2
$ npm i --save faunadb@2.13.0
$ npm i --save firebase@7.10.0
$ npm i --save @angular/fire@5.4.2
$ npm i --save chart.js@2.9.3
$ npm i --save ng2-charts@2.3.0
``
``
$ ng add @angular/material
``
#### Installation
``
$ npm i --save ao-angular
``
#### Edit tsconfig.js
``
...
"paths": {
"@environment": [
"src/environments/environment.ts"
]
}
...
``
#### Edit "AppModule"
``
...
import pt from '@angular/common/locales/pt';
pt[17]['USD'] = pt[17]['BRL'] = ['R$', 'R$'];
import { registerLocaleData } from '@angular/common';
registerLocaleData(pt, 'pt');
import { LOCALE_ID } from '@angular/core';
...
``
``
imports: [
...
NgxWebstorageModule.forRoot(),
AngularFireModule.initializeApp(environment.firebase.configs, environment.firebase.name),
AOModule.forRoot(environment),
...
],
``
``
providers: [
...
{provide: LOCALE_ID, useValue: 'pt'},
]
``
#### Edit "AppComponent"
``
...
constructor(
...
private _auth: AOAuthFirebaseService
) {
}
...
``
#### Copy files
``
cp ~ao-angular/assets/images ------------> /myapp/src/assets/images
``
#### Edit "global.scss"
``
...
/ Ao-Angular styles /
@import '~ao-angular/assets/styles/overrides/material/material.theming';
$palette-primary: $mat-black;
$palette-accent: $mat-deep-purple;
$palette-warn: $mat-red;
@import '~ao-angular/assets/styles/app';
``
#### Edit "index.html"
``
...
``
``
...
...
...
``
----------------------------------------------------------------------------------------
----------------------------------------------------------------------------------------
----------------------------------------------------------------------------------------
----------------------------------------------------------------------------------------
----------------------------------------------------------------------------------------
----------------------------------------------------------------------------------------
{
"peerDependencies": {
"@angular/fire": "5.4.2",
"faunadb": "2.13.0",
"firebase": "7.10.0",
"ngx-pipes": "2.7.3",
"ngx-webstorage": "4.0.2",
"ts-md5": "1.2.7",
"@angular/animations": "8.2.14",
"@angular/common": "8.2.14",
"@angular/compiler": "8.2.14",
"@angular/core": "8.2.14",
"@angular/forms": "8.2.14",
"@angular/platform-browser": "8.2.14",
"@angular/platform-browser-dynamic": "8.2.14",
"@angular/router": "8.2.14",
"rxjs": "6.4.0",
"zone.js": "0.9.1",
"@angular/cdk": "8.2.3",
"@angular/material": "8.2.3",
"@angular/pwa": "0.803.20",
"@angular/service-worker": "8.2.14",
"ajv": "6.10.2",
"chart.js": "2.9.3",
"hammerjs": "2.0.8",
"luxon": "1.21.1",
"ng2-charts": "2.3.0"
},
"dependencies": {
"tslib": "1.10.0"
},
"devDependencies": {
"@angular-devkit/build-angular": "0.803.19",
"@angular/cli": "8.3.19",
"@angular/compiler-cli": "8.2.14",
"@angular/language-service": "8.2.14",
"@types/node": "8.9.5",
"@types/jasmine": "3.3.16",
"@types/jasminewd2": "2.0.8",
"codelyzer": "5.2.0",
"jasmine-core": "3.4.0",
"jasmine-spec-reporter": "4.2.1",
"karma": "4.1.0",
"karma-chrome-launcher": "2.2.0",
"karma-coverage-istanbul-reporter": "2.0.6",
"karma-jasmine": "2.0.1",
"karma-jasmine-html-reporter": "1.4.2",
"protractor": "5.4.2",
"ts-node": "7.0.1",
"tslint": "5.15.0",
"typescript": "3.5.3",
"@angular-devkit/build-ng-packagr": "0.803.19",
"ng-packagr": "5.7.1",
"tsickle": "0.37.1"
}
}
#### Copy files
``
cp ~ao-angular/ngsw-config.json ---------> /myapp
cp ~ao-angular/manifest.webmanifest -----> /myapp/src
cp ~ao-angular/assets/icons -------------> /myapp/src/assets/icons
cp ~ao-angular/assets/images ------------> /myapp/src/assets/images
``
#### Edit "main.ts"
``
import 'hammerjs';
...
``
#### Edit "index.html"
``
YOUR_APP_NAME
``
#### Edit "app.component.html"
``
``
#### Edit "styles.scss"
``
@import '~ao-angular/assets/styles/theming';
$palette-primary: $mat-black;
$palette-accent: $mat-green;
$palette-warn: $mat-red;
@import '~ao-angular/assets/styles/app';
html, #AO-MENU-LOGO {
background-image: url("/assets/images/logo.png");
}
``
Capability
``
"dependencies": {
//
// DEFAULT
//
"@angular/animations": "8.2.14",
"@angular/common": "8.2.14",
"@angular/compiler": "8.2.14",
"@angular/core": "8.2.14",
"@angular/forms": "8.2.14",
"@angular/platform-browser": "8.2.14",
"@angular/platform-browser-dynamic": "8.2.14",
"@angular/router": "8.2.14",
"rxjs": "6.4.0",
"tslib": "1.10.0",
"zone.js": "0.9.1",
//
// EXTRA
//
"@angular/cdk": "8.2.3",
"@angular/fire": "5.2.3",
"@angular/material": "8.2.3",
"@angular/pwa": "0.803.20",
"@angular/service-worker": "8.2.14",
"ajv": "6.10.2",
"chart.js": "2.9.3",
"faunadb": "2.8.0",
"firebase": "7.4.0",
"hammerjs": "2.0.8",
"luxon": "1.21.1",
"ng2-charts": "2.3.0",
"ngx-pipes": "2.6.0",
"ngx-webstorage": "4.0.1",
"ts-md5": "1.2.7"
},
"devDependencies": {
//
// DEFAULT
//
"@angular-devkit/build-angular": "0.803.19",
"@angular/cli": "8.3.19",
"@angular/compiler-cli": "8.2.14",
"@angular/language-service": "8.2.14",
"@types/node": "8.9.5",
"@types/jasmine": "3.3.16",
"@types/jasminewd2": "2.0.8",
"codelyzer": "5.2.0",
"jasmine-core": "3.4.0",
"jasmine-spec-reporter": "4.2.1",
"karma": "4.1.0",
"karma-chrome-launcher": "2.2.0",
"karma-coverage-istanbul-reporter": "2.0.6",
"karma-jasmine": "2.0.1",
"karma-jasmine-html-reporter": "1.4.2",
"protractor": "5.4.2",
"ts-node": "7.0.1",
"tslint": "5.15.0",
"typescript": "3.5.3",
//
// EXTRA
//
"@angular-devkit/build-ng-packagr": "0.803.19",
"ng-packagr": "5.7.1",
"tsickle": "0.37.1"
}
```