Project setup using the ng-cli app setup

ng-c8y-cli.md

1. ng new myc8yapp --routing
2. cd myc8yapp
3. npm i @c8y/ngx-components@next @c8y/style@next && npm i @c8y/cli@next uglifyjs-webpack-plugin autoprefixer@^7.1.1 -D
4. In package.json

append the following properties:

  "main": "src/main.ts",
  "c8y": {
    "application": {
      "name": "application",
      "contextPath": "application",
      "key": "application-application-key"
    }
  }

and add/replace these two scripts

"scripts": {
    "start": "c8ycli serve",
    "build": "c8ycli build",
    "deploy": "c8ycli deploy",

5. in src/main.ts add the following line at the top:

import './polyfills.ts';

and replace the final bootstrap module call with the following code:

export function bootstrap() {
  platformBrowserDynamic()
    .bootstrapModule(AppModule).catch((err) => console.log(err));
}

6. In src/polyfills.ts add the lines

import 'core-js/es7/reflect';

below the comment (around line 20)

/***************************************************************************************************
 * BROWSER POLYFILLS
 */

7. Paste the following code into src/app/app.module.ts:

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppRoutingModule } from './app-routing.module';
import { CoreModule, BootstrapComponent } from '@c8y/ngx-components';

@NgModule({
  imports: [
    BrowserModule,
    AppRoutingModule,
    CoreModule
  ],
  providers: [],
  bootstrap: [BootstrapComponent]
})
export class AppModule { }

8. Replace line 7 of src/app/app-routing.module.ts with:

imports: [RouterModule.forRoot(routes, { enableTracing: false, useHash: true })],

9. Delete app component

rm src/app/app.component*

10. Use the npm scripts

npm start
npm run build
npm run deploy