build(angular): v19

angular.json

@@ -15,18 +15,22 @@
       },
       "architect": {
         "build": {
-          "builder": "@angular-devkit/build-angular:browser",
+          "builder": "@angular-devkit/build-angular:application",
           "options": {
-            "outputPath": "dist/demo",
+            "outputPath": {
+              "base": "dist/demo"
+            },
             "index": "test/index.html",
-            "main": "test/main.ts",
-            "polyfills": "test/polyfills.ts",
+            "polyfills": [
+              "test/polyfills.ts"
+            ],
             "tsConfig": "test/tsconfig.app.json",
             "styles": [
               "test/styles.scss"
             ],
             "scripts": [],
-            "aot": true
+            "aot": true,
+            "browser": "test/main.ts"
           },
           "configurations": {
             "production": {
@@ -36,8 +40,6 @@
               "namedChunks": false,
               "aot": true,
               "extractLicenses": true,
-              "vendorChunk": false,
-              "buildOptimizer": true,
               "budgets": [
                 {
                   "type": "initial",

package.json

@@ -10,23 +10,23 @@
   },
   "private": true,
   "dependencies": {
-    "@angular/common": "^17.3.12",
-    "@angular/compiler": "^17.3.12",
-    "@angular/core": "^17.3.12",
-    "@angular/platform-browser": "^17.3.12",
-    "@angular/platform-browser-dynamic": "^17.3.12",
+    "@angular/common": "^19.2.17",
+    "@angular/compiler": "^19.2.17",
+    "@angular/core": "^19.2.17",
+    "@angular/platform-browser": "^19.2.17",
+    "@angular/platform-browser-dynamic": "^19.2.17",
     "nanostores": "^1.1.0",
     "rxjs": "~7.5.0",
     "tslib": "^2.3.0",
-    "zone.js": "^0.14.10"
+    "zone.js": "^0.15.1"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "^17.3.17",
-    "@angular-eslint/builder": "^17.5.3",
-    "@angular-eslint/schematics": "^17.5.3",
-    "@angular-eslint/template-parser": "^17.5.3",
-    "@angular/cli": "~17.3.17",
-    "@angular/compiler-cli": "^17.3.12",
+    "@angular-devkit/build-angular": "^19.2.19",
+    "@angular-eslint/builder": "^19.8.1",
+    "@angular-eslint/schematics": "^19.8.1",
+    "@angular-eslint/template-parser": "^19.8.1",
+    "@angular/cli": "~19.2.19",
+    "@angular/compiler-cli": "^19.2.17",
     "@types/jasmine": "~4.3.0",
     "@types/node": "^18.11.18",
     "@typescript-eslint/eslint-plugin": "^7.2.0",
@@ -38,9 +38,9 @@
     "karma-coverage-istanbul-reporter": "~2.1.0",
     "karma-jasmine": "~5.1.0",
     "karma-jasmine-html-reporter": "~2.0.0",
-    "ng-packagr": "^17.3.0",
+    "ng-packagr": "^19.2.2",
     "process-inline-templates": "link:@angular-eslint/template/process-inline-templates",
     "recommended": "link:@angular-eslint/template/recommended",
-    "typescript": "5.4.5"
+    "typescript": "5.8.3"
   }
 }

test/example/app.component.ts

@@ -1,8 +1,9 @@
-import { Component } from '@angular/core';
+import { Component } from "@angular/core";
 
 @Component({
-  selector: 'app-root',
-  templateUrl: './app.component.html',
-  styleUrls: ['./app.component.css']
+  selector: "app-root",
+  templateUrl: "./app.component.html",
+  styleUrls: ["./app.component.css"],
+  standalone: false,
 })
-export class AppComponent { }
+export class AppComponent {}

test/example/app.module.ts

@@ -1,20 +1,18 @@
-import { NANOSTORES, NanostoresService } from '@nanostores/angular';
-import { AppComponent } from './app.component';
-import { BrowserModule } from '@angular/platform-browser';
-import { CurrentUserAsyncPipeComponent } from './current-user-async-pipe/current-user-async-pipe.component';
-import { CurrentUserComponent } from './current-user/current-user.component';
-import { NgModule } from '@angular/core';
+import { NgModule } from "@angular/core";
+import { BrowserModule } from "@angular/platform-browser";
+import { NANOSTORES, NanostoresService } from "@nanostores/angular";
+import { AppComponent } from "./app.component";
+import { CurrentUserAsyncPipeComponent } from "./current-user-async-pipe/current-user-async-pipe.component";
+import { CurrentUserComponent } from "./current-user/current-user.component";
 
 @NgModule({
   declarations: [
     AppComponent,
     CurrentUserComponent,
     CurrentUserAsyncPipeComponent,
   ],
-  imports: [
-    BrowserModule
-  ],
+  imports: [BrowserModule],
   providers: [{ provide: NANOSTORES, useClass: NanostoresService }],
-  bootstrap: [AppComponent]
+  bootstrap: [AppComponent],
 })
-export class AppModule { }
+export class AppModule {}

test/example/current-user-async-pipe/current-user-async-pipe.component.ts

@@ -1,16 +1,18 @@
-import { IUser, User } from '../stores/user';
-import { Observable, switchMap } from 'rxjs';
-import { Component } from '@angular/core';
-import { NanostoresService } from '@nanostores/angular';
-import { profile } from '../stores/profile';
+import { Component, inject } from "@angular/core";
+import { NanostoresService } from "@nanostores/angular";
+import { Observable, switchMap } from "rxjs";
+import { profile } from "../stores/profile";
+import { IUser, User } from "../stores/user";
 
 @Component({
-  selector: 'app-current-user-async-pipe',
-  template: '<p *ngIf="(currentUser$ | async) as user">{{ user.name }}</p>'
+  selector: "app-current-user-async-pipe",
+  template: '<p *ngIf="(currentUser$ | async) as user">{{ user.name }}</p>',
+  standalone: false,
 })
 export class CurrentUserAsyncPipeComponent {
-  currentUser$: Observable<IUser> = this.nanostores.useStore(profile)
-    .pipe(switchMap(({ userId }) => this.nanostores.useStore(User(userId))));
+  private nanostores = inject(NanostoresService);
 
-  constructor(private nanostores: NanostoresService) { }
+  currentUser$: Observable<IUser> = this.nanostores
+    .useStore(profile)
+    .pipe(switchMap(({ userId }) => this.nanostores.useStore(User(userId))));
 }

test/example/current-user/current-user.component.ts

@@ -1,22 +1,22 @@
-import { Component, OnInit } from '@angular/core';
-import { NanostoresService } from '@nanostores/angular';
-import { User } from '../stores/user';
-import { profile } from '../stores/profile';
-import { switchMap } from 'rxjs';
+import { Component, inject, OnInit } from "@angular/core";
+import { NanostoresService } from "@nanostores/angular";
+import { switchMap } from "rxjs";
+import { profile } from "../stores/profile";
+import { User } from "../stores/user";
 
 @Component({
-  selector: 'app-current-user',
-  template: '<p>{{ text }}</p>'
+  selector: "app-current-user",
+  template: "<p>{{ text }}</p>",
+  standalone: false,
 })
 export class CurrentUserComponent implements OnInit {
-  text = '';
-
-  constructor(private nanostores: NanostoresService) { }
+  private nanostores = inject(NanostoresService);
+  text = "";
 
   ngOnInit() {
-    this.nanostores.useStore(profile).pipe(
-      switchMap(({ userId }) => this.nanostores.useStore(User(userId)))
-    )
-    .subscribe(user => this.text = `User name is ${user.name}`);
+    this.nanostores
+      .useStore(profile)
+      .pipe(switchMap(({ userId }) => this.nanostores.useStore(User(userId))))
+      .subscribe((user) => (this.text = `User name is ${user.name}`));
   }
 }

tsconfig.json

@@ -8,6 +8,7 @@
     },
     "baseUrl": "./",
     "outDir": "./dist/out-tsc",
+    "esModuleInterop": true,
     "forceConsistentCasingInFileNames": true,
     "strict": true,
     "noImplicitOverride": true,
@@ -16,7 +17,6 @@
     "noFallthroughCasesInSwitch": true,
     "sourceMap": true,
     "declaration": false,
-    "downlevelIteration": true,
     "experimentalDecorators": true,
     "moduleResolution": "node",
     "importHelpers": true,