feat(repo): fix build errors in nitropack and during server and stati…

…c page rendering

.github/workflows/ci.yml

@@ -44,8 +44,8 @@ jobs:
  - run: corepack use pnpm@9
  - uses: actions/setup-node@v4
  with:
- cache: "pnpm"
- cache-dependency-path: "**/pnpm-lock.yaml"
+ cache: 'pnpm'
+ cache-dependency-path: '**/pnpm-lock.yaml'
  - name: Install
  run: pnpm install --frozen-lockfile --prefer-offline
 
@@ -67,8 +67,8 @@ jobs:
  - run: pnpm --version
  - uses: actions/setup-node@v4
  with:
- cache: "pnpm"
- cache-dependency-path: "**/pnpm-lock.yaml"
+ cache: 'pnpm'
+ cache-dependency-path: '**/pnpm-lock.yaml'
  - name: Install
  run: pnpm install --frozen-lockfile --prefer-offline
  - name: Build
@@ -87,8 +87,8 @@ jobs:
  - run: pnpm --version
  - uses: actions/setup-node@v4
  with:
- cache: "pnpm"
- cache-dependency-path: "**/pnpm-lock.yaml"
+ cache: 'pnpm'
+ cache-dependency-path: '**/pnpm-lock.yaml'
  - name: Install
  run: pnpm install --frozen-lockfile --prefer-offline
  - name: Test
@@ -107,8 +107,8 @@ jobs:
  - run: pnpm --version
  - uses: actions/setup-node@v4
  with:
- cache: "pnpm"
- cache-dependency-path: "**/pnpm-lock.yaml"
+ cache: 'pnpm'
+ cache-dependency-path: '**/pnpm-lock.yaml'
  - name: Install
  run: pnpm install --frozen-lockfile --prefer-offline
  - name: Install Cypress

apps/app/.env

@@ -0,0 +1,3 @@
+# we don't want to see a massive output of `[DEP0166] DeprecationWarning: Use of deprecated double slash resolving` in the console
+# this is an issue upstream with nitropack and will be resolved by them
+NODE_OPTIONS=--no-deprecation

apps/app/.gitignore

@@ -0,0 +1 @@
+!.env

apps/app/nitro.config.ts

@@ -4,4 +4,5 @@ export default defineNitroConfig({
  rollupConfig: {
  plugins: [typescriptPaths({ tsConfigPath: 'tsconfig.base.json', preserveExtensions: true })],
  },
+ node: true,
 });

apps/app/src/app.config.ts

@@ -2,7 +2,7 @@ import { provideFileRouter } from '@analogjs/router';
 import type { ApplicationConfig } from '@angular/core';
 import { provideClientHydration } from '@angular/platform-browser';
 import { PreloadAllModules, withInMemoryScrolling, withNavigationErrorHandler, withPreloading } from '@angular/router';
-import { provideTrpcClient } from './trpc-client';
+import { provideTrpcClient } from './services/trpc-client.service';
 
 export const appConfig: ApplicationConfig = {
  providers: [

apps/app/src/app/pages/(examples)/examples/notes/(notes).page.ts

@@ -11,7 +11,7 @@ import { HlmSpinnerComponent } from '@spartan-ng/ui-spinner-helm';
 import { SignalFormBuilder, SignalInputDirective, V, withErrorComponent } from 'ng-signal-forms';
 import { type Observable, Subject, catchError, of, switchMap, take, tap } from 'rxjs';
 import type { Note } from '../../../../../db';
-import { injectTRPCClient } from '../../../../../trpc-client';
+import type { TrpcService } from '../../../../../services/trpc-client.service';
 import { InputErrorComponent } from '../../../../shared/input-error/input-error.component';
 import { SpartanInputErrorDirective } from '../../../../shared/input-error/input-error.directive';
 import { metaWith } from '../../../../shared/meta/meta.util';
@@ -102,7 +102,7 @@ export const routeMeta: RouteMeta = {
  `,
 })
 export default class NotesExamplePageComponent {
- private _trpc = injectTRPCClient();
+ private _trpc = this.trpcService.getClient();
  private _sfb = inject(SignalFormBuilder);
  private _refreshNotes$ = new Subject<void>();
  private _notes$ = this._refreshNotes$.pipe(
@@ -169,7 +169,7 @@ export default class NotesExamplePageComponent {
  }),
  }));
 
- constructor() {
+ constructor(private trpcService: TrpcService) {
  this._notes$.subscribe();
  void waitFor(this._notes$);
  this.updateNotes('initial');

apps/app/src/services/trpc-client.service.ts

@@ -0,0 +1,22 @@
+import { Injectable, inject } from '@angular/core';
+import { createTrpcClient } from '@spartan-ng/trpc';
+import superjson from 'superjson';
+import type { AppRouter } from '../server/trpc/routers';
+
+export const { provideTrpcClient, tRPCClient } = createTrpcClient<AppRouter>({
+ url: '/api/trpc',
+ options: {
+ transformer: superjson,
+ },
+});
+
+@Injectable({
+ providedIn: 'root',
+})
+export class TrpcService {
+ private client = inject(tRPCClient);
+
+ public getClient() {
+ return this.client;
+ }
+}

apps/app/tsconfig.app.json

@@ -4,7 +4,8 @@
  "outDir": "../../dist/out-tsc",
  "types": ["node"],
  "target": "ES2022",
- "useDefineForClassFields": false
+ "useDefineForClassFields": false,
+ "importHelpers": false
  },
  "files": ["src/main.ts", "src/main.server.ts"],
  "include": ["src/**/*.d.ts", "src/app/routes/**/*.ts", "src/app/pages/**/*.page.ts"],

apps/app/vite.config.ts

@@ -112,11 +112,6 @@ export default defineConfig(({ mode }) => {
  host: 'https://www.spartan.ng',
  },
  },
- nitro: {
- rollupConfig: {
- plugins: [],
- },
- },
  }),
  nxViteTsPaths(),
  visualizer() as Plugin,

package.json

@@ -45,7 +45,7 @@
  "@analogjs/trpc": "~0.2.45",
  "@analogjs/vite-plugin-angular": "1.2.2",
  "@angular/animations": "17.3.5",
- "@angular/cdk": "17.3.0",
+ "@angular/cdk": "17.3.5",
  "@angular/common": "17.3.5",
  "@angular/compiler": "17.3.5",
  "@angular/core": "17.3.5",
@@ -61,17 +61,17 @@
  "@nx/angular": "18.3.3",
  "@nx/devkit": "18.3.3",
  "@nx/plugin": "18.3.3",
- "@swc/helpers": "0.5.3",
- "@testing-library/cypress": "^10.0.0",
- "@trpc/client": "~10.26.0",
- "@trpc/server": "~10.26.0",
- "class-variance-authority": "^0.6.0",
- "clsx": "^1.2.1",
- "drizzle-orm": "^0.28.3",
- "embla-carousel-angular": "^14.0.0",
- "enquirer": "2.3.6",
+ "@swc/helpers": "0.5.10",
+ "@testing-library/cypress": "^10.0.1",
+ "@trpc/client": "~10.45.2",
+ "@trpc/server": "~10.45.2",
+ "class-variance-authority": "^0.7.0",
+ "clsx": "^2.1.1",
+ "drizzle-orm": "^0.30.9",
+ "embla-carousel-angular": "^14.1.0",
+ "enquirer": "2.4.1",
  "front-matter": "^4.0.2",
- "h3": "^1.6.2",
+ "h3": "^1.11.1",
  "isomorphic-fetch": "^3.0.0",
  "marked": "^5.0.2",
  "marked-gfm-heading-id": "3.1.0",
@@ -91,11 +91,14 @@
  "superjson": "^2.2.1",
  "tailwind-merge": "^2.3.0",
  "tailwindcss-animate": "^1.0.7",
- "tslib": "~2.6.2",
  "ufo": "1.5.3",
  "zod": "3.22.5",
  "zone.js": "0.14.2"
  },
+ "overrides": {
+ "babel-plugin-macros": "3.1.0",
+ "nitropack": "2.9.6"
+ },
  "devDependencies": {
  "@analogjs/platform": "^1.2.2",
  "@angular-devkit/build-angular": "17.3.5",
@@ -167,35 +170,37 @@
  "eslint-config-prettier": "9.1.0",
  "eslint-plugin-cypress": "2.15.2",
  "jest": "^29.7.0",
- "jest-axe": "^7.0.1",
+ "jest-axe": "^8.0.0",
  "jest-environment-jsdom": "^29.7.0",
  "jest-environment-node": "^29.7.0",
  "jest-preset-angular": "14.0.3",
- "jsdom": "22.1.0",
- "jsonc-eslint-parser": "^2.3.0",
- "lint-staged": "^13.1.0",
+ "jsdom": "24.0.0",
+ "jsonc-eslint-parser": "^2.4.0",
+ "lint-staged": "^15.2.2",
  "ng-packagr": "17.3.0",
+ "nitropack": "^2.9.6",
  "nx": "18.3.3",
  "oxlint": "^0.3.1",
- "playwright": "^1.30.0",
+ "playwright": "^1.43.1",
  "postcss": "^8.4.38",
  "postcss-import": "~16.1.0",
- "postcss-preset-env": "~9.5.6",
+ "postcss-preset-env": "~9.5.9",
  "postcss-url": "~10.1.3",
  "prettier": "^3.2.5",
  "prettier-plugin-organize-imports": "^3.2.4",
  "prettier-plugin-tailwindcss": "^0.5.14",
  "replace-json-property": "^1.9.0",
- "rollup": "^4.16.0",
+ "rollup": "^4.16.4",
  "rollup-plugin-typescript-paths": "^1.5.0",
  "rollup-plugin-visualizer": "^5.12.0",
- "semantic-release": "^21.0.7",
- "start-server-and-test": "^1.15.4",
- "tailwindcss": "^3.0.2",
- "ts-jest": "^29.1.0",
- "ts-node": "10.9.1",
+ "semantic-release": "^23.0.8",
+ "start-server-and-test": "^2.0.3",
+ "tailwindcss": "^3.4.3",
+ "ts-jest": "^29.1.2",
+ "ts-node": "10.9.2",
+ "tslib": "~2.6.2",
  "typescript": "5.4.5",
- "verdaccio": "^5.0.4",
+ "verdaccio": "^5.30.3",
  "vite": "5.2.10",
  "vite-plugin-eslint": "^1.8.1",
  "vite-tsconfig-paths": "4.3.2",