feat: angular 9 ivy support (#2169)

closes #2152
closes #2060

CHANGELOG.md

@@ -1,3 +1,12 @@
+<a name="9.0.0"></a>
+# [9.0.0](https://github.com/NativeScript/nativescript-angular/compare/8.20.4...9.0.0) (2020-06-03)
+
+
+### Features
+
+* angular 9 ivy ([fbe2450](https://github.com/NativeScript/nativescript-angular/commit/fbe2450))
+
+
 <a name="8.20.4"></a>
 ## [8.20.4](https://github.com/NativeScript/nativescript-angular/compare/8.20.3...8.20.4) (2020-01-07)
 
@@ -649,7 +658,7 @@ Angular apps described in [this](https://angular.io/guide/ngmodule-faq#q-browser
 Migration steps:
 In all NgModules, except the root one (`AppModule`), replace:
 ```
-import { NativeScriptModule } from "nativescript-angular/nativescript.module";
+import { NativeScriptModule } from "@nativescript/angular";
 …
 @NgModule({
     imports: [

build/pack-scripts/package.json

@@ -10,9 +10,9 @@
   "license": "ISC",
   "devDependencies": {
     "@types/node": "^12.7.12",
-    "fs-extra": "^8.1.0",
+    "fs-extra": "^9.0.0",
     "rimraf": "^3.0.0",
-    "ts-node": "^8.4.1",
-    "typescript": "^3.6.4"
+    "ts-node": "^8.10.2",
+    "typescript": "^3.8.3"
   }
 }

build/pack-scripts/tsconfig.json

@@ -6,10 +6,11 @@
         "emitDecoratorMetadata": true,
         "noEmitHelpers": true,
         "noEmitOnError": true,
+        "skipLibCheck": true,
         "lib": [
-            "es6",
+            "es2017",
             "dom",
-            "es2015.iterable"
+            "es6"
         ],
         "types": [
             "node"

e2e/animation-examples/app/app.module.ts

@@ -4,11 +4,21 @@ import {
     NgModuleFactoryLoader
 } from "@angular/core";
 
-import { NativeScriptModule } from "nativescript-angular/nativescript.module";
-import { NativeScriptAnimationsModule } from "nativescript-angular/animations";
-import { NSModuleFactoryLoader } from "nativescript-angular/router";
+import { NativeScriptModule } from "@nativescript/angular";
+import { NativeScriptAnimationsModule } from "@nativescript/angular/animations";
+import { NSModuleFactoryLoader } from "@nativescript/angular/router";
+
+import { AppRoutingModule } from "./app.routing";
+import { AnimationsListComponent } from "./animations-list.component";
+import { AnimationBuilderComponent } from "./animation-builder.component";
+import { ExternalAnimationComponent } from "./external-animation.component";
+import { FadeInOutComponent } from "./fade-in-out.component";
+import { OptionsComponent } from "./options.component";
+import { OptionsDefaultComponent } from "./options-default.component";
+import { AnimateChildComponent } from "./animate-child.component";
+import { SelectorAllComponent } from "./selector-all.component";
+import { QueryStaggerComponent } from "./query-stagger.component";
 
-import { AppRoutingModule, routedComponents } from "./app.routing";
 import { AppComponent } from "./app.component";
 
 @NgModule({
@@ -17,7 +27,15 @@ import { AppComponent } from "./app.component";
     ],
     declarations: [
         AppComponent,
-        ...routedComponents,
+        AnimationsListComponent,
+        AnimationBuilderComponent,
+        ExternalAnimationComponent,
+        FadeInOutComponent,
+        OptionsComponent,
+        OptionsDefaultComponent,
+        AnimateChildComponent,
+        SelectorAllComponent,
+        QueryStaggerComponent,
     ],
     imports: [
         NativeScriptModule,

e2e/animation-examples/app/app.routing.ts

@@ -1,6 +1,6 @@
 import { NgModule } from "@angular/core";
 import { Routes } from "@angular/router";
-import { NativeScriptRouterModule } from "nativescript-angular/router";
+import { NativeScriptRouterModule } from "@nativescript/angular/router";
 
 import { AnimationsListComponent } from "./animations-list.component";
 import { AnimationBuilderComponent } from "./animation-builder.component";
@@ -23,23 +23,11 @@ const routes: Routes = [
     { path: "animate-child", component: AnimateChildComponent },
     { path: "selector", component: SelectorAllComponent },
     { path: "query-stagger", component: QueryStaggerComponent },
-    { path: "hero", loadChildren: "./hero/hero.module#HeroModule" },
+    { path: "hero", loadChildren: () => import("./hero/hero.module").then(m => m.HeroModule) },
 ];
 
 @NgModule({
   imports: [NativeScriptRouterModule.forRoot(routes)],
   exports: [NativeScriptRouterModule],
 })
 export class AppRoutingModule { }
-
-export const routedComponents = [
-    AnimationsListComponent,
-    AnimationBuilderComponent,
-    ExternalAnimationComponent,
-    FadeInOutComponent,
-    OptionsComponent,
-    OptionsDefaultComponent,
-    AnimateChildComponent,
-    SelectorAllComponent,
-    QueryStaggerComponent,
-];

e2e/animation-examples/app/hero/hero-routing.module.ts

@@ -1,6 +1,6 @@
 import { NgModule } from "@angular/core";
 import { Routes } from "@angular/router";
-import { NativeScriptRouterModule } from "nativescript-angular/router";
+import { NativeScriptRouterModule } from "@nativescript/angular/router";
 
 import { HeroTeamBuilderComponent } from './hero-team-builder.component';
 

e2e/animation-examples/app/hero/hero.module.ts

@@ -1,5 +1,5 @@
 import { NgModule, NO_ERRORS_SCHEMA } from "@angular/core";
-import { NativeScriptCommonModule } from "nativescript-angular/common";
+import { NativeScriptCommonModule } from "@nativescript/angular/common";
 
 import { HeroRoutingModule, routedComponents } from "./hero-routing.module";
 

e2e/animation-examples/app/main.aot.ts

@@ -1,4 +1,4 @@
-import { platformNativeScript } from "nativescript-angular/platform-static";
+import { platformNativeScript } from "@nativescript/angular/platform-static";
 import { AppModuleNgFactory } from "./app.module.ngfactory";
 
 platformNativeScript().bootstrapModuleFactory(AppModuleNgFactory);

e2e/animation-examples/app/main.ts

@@ -1,6 +1,6 @@
-import { platformNativeScriptDynamic } from "nativescript-angular/platform";
-import { animationsTraceCategory } from "nativescript-angular/trace";
-import { setCategories, enable } from "trace";
+import { platformNativeScriptDynamic } from "@nativescript/angular/platform";
+import { animationsTraceCategory } from "@nativescript/angular/trace";
+import { setCategories, enable } from "@nativescript/core/trace";
 
 import { AppModule } from "./app.module";
 

e2e/animation-examples/ngcc.config.js

@@ -0,0 +1,19 @@
+module.exports = {
+  packages: {
+    "@nativescript/angular": {
+      entryPoints: {
+        ".": {
+          override: {
+            main: "./index.js",
+            typings: "./index.d.ts",
+          },
+          ignoreMissingDependencies: true,
+        }
+      },
+      ignorableDeepImportMatchers: [
+        /tns-core-modules\//,
+        /@nativescript\/core\//,
+      ]
+    }
+  }
+};

e2e/animation-examples/package.json

@@ -6,31 +6,31 @@
   "nativescript": {
     "id": "org.nativescript.ng4animations",
     "tns-ios": {
-      "version": "latest"
+      "version": "6.5.1"
     },
     "tns-android": {
       "version": "latest"
     }
   },
   "dependencies": {
-    "@angular/animations": "~8.2.0",
-    "@angular/common": "~8.2.0",
-    "@angular/compiler": "~8.2.0",
-    "@angular/core": "~8.2.0",
-    "@angular/forms": "~8.2.0",
-    "@angular/platform-browser": "~8.2.0",
-    "@angular/platform-browser-dynamic": "~8.2.0",
-    "@angular/router": "~8.2.0",
-    "nativescript-angular": "file:../../nativescript-angular-package",
+    "@angular/animations": "~9.1.0",
+    "@angular/common": "~9.1.0",
+    "@angular/compiler": "~9.1.0",
+    "@angular/core": "~9.1.0",
+    "@angular/forms": "~9.1.0",
+    "@angular/platform-browser": "~9.1.0",
+    "@angular/platform-browser-dynamic": "~9.1.0",
+    "@angular/router": "~9.1.0",
+    "@nativescript/angular": "file:../../dist/nativescript-angular-scoped.tgz",
     "nativescript-theme-core": "~1.0.2",
     "reflect-metadata": "~0.1.8",
-    "rxjs": "^6.4.0",
-    "tns-core-modules": "next",
-    "zone.js": "^0.9.1"
+    "rxjs": "~6.5.5",
+    "@nativescript/core": "next",
+    "zone.js": "^0.10.3"
   },
   "devDependencies": {
-    "@angular/compiler-cli": "~8.2.0",
-    "@ngtools/webpack": "~8.2.0",
+    "@angular/compiler-cli": "~9.1.0",
+    "@ngtools/webpack": "~9.1.0",
     "@types/chai": "~4.1.7",
     "@types/mocha": "~5.2.5",
     "@types/node": "~10.12.18",
@@ -44,14 +44,18 @@
     "nativescript-css-loader": "~0.26.0",
     "nativescript-dev-appium": "^6.0.0",
     "nativescript-dev-webpack": "next",
-    "typescript": "~3.5.3"
+    "typescript": "~3.8.3"
   },
   "scripts": {
+    "clean": "npx rimraf hooks node_modules package-lock.json",
+    "setup": "cd ../../nativescript-angular && npm run pack && cd ../e2e/animation-examples && npm run clean",
     "u": "update-ns-webpack",
     "e2e": "tsc -p e2e && mocha --opts ../config/mocha.opts --recursive e2e --appiumCapsLocation ../config/appium.capabilities.json",
     "e2e-watch": "tsc -p e2e --watch",
     "update-app-ng-deps": "update-app-ng-deps",
     "ns-verify-bundle": "ns-verify-bundle",
-    "update-ns-webpack": "update-ns-webpack"
+    "update-ns-webpack": "update-ns-webpack",
+    "ngcc": "ngcc --properties es2015 module main --first-only",
+    "postinstall": "npm run ngcc"
   }
 }

e2e/animation-examples/tsconfig.json

@@ -6,33 +6,26 @@
         "emitDecoratorMetadata": true,
         "noEmitHelpers": true,
         "noEmitOnError": true,
+        "skipLibCheck": true,
         "lib": [
-            "es6",
+            "es2017",
             "dom",
-            "es2015.iterable"
+            "es6"
         ],
         "baseUrl": ".",
         "paths": {
-            "*": [
-                "./node_modules/tns-core-modules/*",
-                "./node_modules/*",
-                "./node_modules/nativescript-angular/node_modules/*"
-            ],
             "~/*": [
                 "app/*"
+            ],
+            "*": [
+                "./node_modules/*"
             ]
         }
     },
-    "include": [
-        "../../nativescript-angular-package",
-        "../../nativescript-angular",
-        "**/*"
+    "files": [
+      "./app/main.ts"
     ],
     "exclude": [
-        "../../nativescript-angular-package/node_modules",
-        "../../nativescript-angular-package/**/*.d.ts",
-        "../../nativescript-angular/node_modules",
-        "../../nativescript-angular/**/*.d.ts",
         "node_modules",
         "platforms",
         "**/*.aot",

e2e/animation-examples/tsconfig.tns.json

@@ -1,7 +1,7 @@
 {
     "extends": "./tsconfig",
     "compilerOptions": {
-        "module": "es2015",
+        "module": "ESNext",
         "moduleResolution": "node"
     }
 }

e2e/modal-navigation-ng/app/app.component.ts

@@ -1,11 +1,11 @@
 import { Component, ViewContainerRef } from "@angular/core";
 import { Router, NavigationEnd } from "@angular/router";
-import { NSLocationStrategy } from "nativescript-angular/router/ns-location-strategy";
+import { NSLocationStrategy } from "@nativescript/angular";
 
 import { ViewContainerRefService } from "./shared/ViewContainerRefService";
 
 import { AppModule } from "./app.module";
-import { ModalDialogOptions, ModalDialogService } from "nativescript-angular";
+import { ModalDialogOptions, ModalDialogService } from "@nativescript/angular";
 import { ModalViewComponent } from "./modal-shared/modal-view.component";
 
 @Component({

e2e/modal-navigation-ng/app/app.module.ts

@@ -1,5 +1,5 @@
 import { NgModule, NO_ERRORS_SCHEMA } from "@angular/core";
-import { NativeScriptModule } from "nativescript-angular/nativescript.module";
+import { NativeScriptModule } from "@nativescript/angular";
 import { AppRoutingModule } from "./app.routing";
 import { AppComponent } from "./app.component";
 import { NamedRouterComponent } from "./named-router.component";
@@ -19,9 +19,9 @@ import { ModalViewContentComponent } from "./modal-shared/modal-view-content.com
 import { ModalSharedSecondComponent } from "./modal-shared/modal-shared-second.component";
 import { ViewContainerRefService } from "./shared/ViewContainerRefService";
 
-import { enable as traceEnable, addCategories } from "tns-core-modules/trace";
-import { routerTraceCategory } from "nativescript-angular/trace";
-import { NativeScriptPlatformRef } from "nativescript-angular";
+import { enable as traceEnable, addCategories } from "@nativescript/core/trace";
+import { routerTraceCategory } from "@nativescript/angular/trace";
+import { NativeScriptPlatformRef } from "@nativescript/angular";
 
 addCategories(routerTraceCategory);
 traceEnable();

e2e/modal-navigation-ng/app/app.routing.ts

@@ -1,5 +1,5 @@
 import { NgModule } from "@angular/core";
-import { NativeScriptRouterModule } from "nativescript-angular/router";
+import { NativeScriptRouterModule } from "@nativescript/angular/router";
 import { Routes, Router } from "@angular/router";
 
 import { HomeComponent } from "./home/home.component";

e2e/modal-navigation-ng/app/home/home.component.ts

@@ -1,16 +1,16 @@
 import { Component, ViewContainerRef } from "@angular/core";
-import { ModalDialogService, ModalDialogOptions } from "nativescript-angular/directives/dialogs";
-import { RouterExtensions } from "nativescript-angular/router";
-import { EventData } from "tns-core-modules/data/observable";
+import { ModalDialogService, ModalDialogOptions } from "@nativescript/angular/directives/dialogs";
+import { RouterExtensions } from "@nativescript/angular/router";
+import { EventData } from "@nativescript/core/data/observable";
 
 import { ViewContainerRefService } from "../shared/ViewContainerRefService";
 import { ModalRouterComponent } from "../modal/modal-router/modal-router.component";
 import { ModalComponent } from "../modal/modal.component";
 import { ModalViewComponent } from "../modal-shared/modal-view.component";
-import { confirm } from "tns-core-modules/ui/dialogs";
+import { confirm } from "@nativescript/core/ui/dialogs";
 
 import { AppModule } from "../app.module";
-import { PageService } from "nativescript-angular";
+import { PageService } from "@nativescript/angular";
 
 @Component({
   moduleId: module.id,

e2e/modal-navigation-ng/app/layout.component.ts

@@ -1,7 +1,7 @@
 import { Component, ViewContainerRef } from "@angular/core";
 import { Router, NavigationEnd } from "@angular/router";
-import { NSLocationStrategy } from "nativescript-angular/router/ns-location-strategy";
-import { ModalDialogService, ModalDialogOptions } from "nativescript-angular/directives/dialogs";
+import { NSLocationStrategy } from "@nativescript/angular";
+import { ModalDialogService, ModalDialogOptions } from "@nativescript/angular/directives/dialogs";
 import { ModalViewComponent } from "./modal-shared/modal-view.component";
 import { ViewContainerRefService } from "./shared/ViewContainerRefService";
 import { AppModule } from "./app.module";

e2e/modal-navigation-ng/app/main.aot.ts

@@ -1,7 +1,7 @@
 // this import should be first in order to load some required settings (like globals and reflect-metadata)
-import { platformNativeScript } from "nativescript-angular/platform-static";
+import { platformNativeScript } from "@nativescript/angular/platform-static";
 import { AppModule } from "./app.module";
-import { NativeScriptPlatformRef } from "nativescript-angular";
+import { NativeScriptPlatformRef } from "@nativescript/angular";
 // "./app.module.ngfactory" is a dynamically generated module when compiled with AoT.
 import { AppModuleNgFactory } from "./app.module.ngfactory";
 

e2e/modal-navigation-ng/app/main.ts

@@ -1,8 +1,8 @@
 // this import should be first in order to load some required settings (like globals and reflect-metadata)
-import { platformNativeScriptDynamic } from "nativescript-angular/platform";
+import { platformNativeScriptDynamic } from "@nativescript/angular/platform";
 
 import { AppModule } from "./app.module";
-import { NativeScriptPlatformRef } from "nativescript-angular";
+import { NativeScriptPlatformRef } from "@nativescript/angular";
 
 AppModule.platformRef = <NativeScriptPlatformRef>platformNativeScriptDynamic();
 AppModule.platformRef.bootstrapModule(AppModule);

e2e/modal-navigation-ng/app/modal-nested/modal-nested.component.ts

@@ -1,6 +1,6 @@
 import { Component } from "@angular/core";
-import { View, ShownModallyData } from "tns-core-modules/ui/core/view"
-import { ModalDialogParams } from "nativescript-angular/directives/dialogs";
+import { View, ShownModallyData } from "@nativescript/core/ui/core/view"
+import { ModalDialogParams } from "@nativescript/angular/directives/dialogs";
 
 @Component({
     moduleId: module.id,