There was a project that was written by him initially under the Angulyar 2. for the prodakshin, they used a set of crutches that made the aot variant (this case was going for 2 minutes at worst). But there were a lot of problems when adding other packages, in connection with which, Angulyar4 came out, and then 5 - there was a question about updating and moving away from the crutches to the standard from the box, which gives Angulyar.
But everything turned out to be less joyful. The jit (ng build) build option wound up with almost no tambourine.
There is a problem with the aot option. It was decided to update the packages - after which it gathered, as it turned out that something was wrong there - it did not work.
The debugger writes: No NgModule metadata found for 'AppModule'. Something is missing somewhere.
.angular-cli.json
{ "$schema": "./node_modules/@angular/cli/lib/config/schema.json", "project": { "name": "mc.4.0", "ejected": false }, "apps": [ { "root": "src", "outDir": "dist", "assets": [ "assets", "favicon.ico" ], "index": "index.html", "main": "app/main.ts", "polyfills": "polyfills.ts", "test": "test.ts", "tsconfig": "tsconfig.app.json", "testTsconfig": "tsconfig.spec.json", "prefix": "app", "styles": [], "scripts": [], "environmentSource": "environments/environment.ts", "environments": { "dev": "environments/environment.ts", "prod": "environments/environment.prod.ts" } } ], "e2e": { "protractor": { "config": "./protractor.conf.js" } }, "lint": [ { "project": "src/tsconfig.app.json", "exclude": "**/node_modules/**" }, { "project": "src/tsconfig.spec.json", "exclude": "**/node_modules/**" }, { "project": "e2e/tsconfig.e2e.json", "exclude": "**/node_modules/**" } ], "test": { "karma": { "config": "./karma.conf.js" } }, "defaults": { "styleExt": "css", "component": { } } } tsconfig.app.json
{ "extends": "../tsconfig.json", "compilerOptions": { "outDir": "../out-tsc/app", "baseUrl": "./", "module": "es2015", "types": [] }, "exclude": [ "test.ts", "**/*.spec.ts" ] } tsconfig.json
{ "compileOnSave": false, "compilerOptions": { "outDir": "./dist/out-tsc", "sourceMap": true, "declaration": false, "moduleResolution": "node", "emitDecoratorMetadata": true, "experimentalDecorators": true, "target": "es5", "typeRoots": [ "node_modules/@types" ], "lib": [ "es2017", "dom" ] }, "angularCompilerOptions": { "genDir": "compiled", "strictMetadataEmit" : true, "skipMetadataEmit" : false } } tsconfig.spec.json
{ "extends": "../tsconfig.json", "compilerOptions": { "outDir": "../out-tsc/spec", "baseUrl": "./", "module": "commonjs", "target": "es5", "types": [ "jasmine", "node" ] }, "files": [ "test.ts" ], "include": [ "**/*.spec.ts", "**/*.d.ts" ] } index.html
<!doctype html> <html> <head> <base href="/"> <title></title> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="icon" type="image/x-icon" href="favicon.ico"> </head> <body > <my-app style="height:100%;"></my-app> </body> </html> app.component.ts
import { Component } from '@angular/core'; @Component({ selector: 'my-app', template: `<router-outlet></router-outlet>` }) export class AppComponent {} app.module.ts
import { NgModule } from '@angular/core'; import { BrowserModule } from '@angular/platform-browser'; import { FormsModule } from '@angular/forms'; import { LoginComponent } from './components/comp.login'; import { ClientComponent } from './components/comp.client'; import { MainComponent } from './components/comp.main'; import { ProjectComponent } from './components/comp.project'; import { AppComponent } from './app.component'; import { DialogComponent } from './components/comp.addclient'; import {SettingsComponent} from './components/comp.settings'; import {CalendarComponent } from './components/comp.calendar'; import {AnalyticsComponent } from './components/comp.analytics'; import {BrowserAnimationsModule} from '@angular/platform-browser/animations'; import { RouterModule, Routes } from '@angular/router'; import { HttpClientModule } from '@angular/common/http'; import {ColorPickerModule} from 'ngx-color-picker'; import {MyDatePickerModule } from '../../node_modules/mydatepicker/dist/my-date-picker.module'; import {ServerString} from "./set/serverstring"; import { CookieModule } from 'ngx-cookie'; import { NguiAutoCompleteModule } from '@ngui/auto-complete'; import {NgxChartsModule} from '@swimlane/ngx-charts'; import {SoundService} from "./set/SoundService"; const appRoutes: Routes = [ { path: 'login/:pageToGo', component: LoginComponent }, { path: 'login', redirectTo: 'login/main', pathMatch: 'full'}, { path: 'main', component: MainComponent }, { path: 'client/:id', component: ClientComponent }, { path: 'project/:id', component: ProjectComponent }, { path: 'settings', component: SettingsComponent }, { path: 'calendar', component: CalendarComponent }, { path: 'analytics', component: AnalyticsComponent }, { path: '**', redirectTo: 'main', pathMatch: 'full'} ]; @NgModule({ imports: [ MyDatePickerModule, BrowserModule, FormsModule, HttpClientModule, RouterModule.forRoot(appRoutes),CookieModule.forRoot(), ColorPickerModule, BrowserAnimationsModule, NguiAutoCompleteModule , NgxChartsModule ], declarations: [ AppComponent, LoginComponent, MainComponent, ClientComponent, ProjectComponent, DialogComponent, SettingsComponent, CalendarComponent , AnalyticsComponent], bootstrap: [ AppComponent ], providers: [ServerString, SoundService] }) export class AppModule { } main.ts
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; import { AppModule } from './app.module'; import { enableProdMode } from '@angular/core'; import { environment } from '../environments/environment'; if (environment.production) { enableProdMode(); } enableProdMode(); console.log('Running ng' + '5^ compiled'); const platform = platformBrowserDynamic(); platform.bootstrapModule(AppModule); polifills.ts
import 'core-js/es7/reflect'; import 'web-animations-js'; import 'zone.js/dist/zone'; 