Update anguar

.github/workflows/test.yml

@@ -30,4 +30,4 @@ jobs:
 #        run: npx nx affected --target=test --configuration=ci --parallel --base=remotes/origin/${{ inputs.base }} --head=${{ inputs.head }}
 
       - name: E2E Test
-        run: npm nx run nx-angular-mf-e2e:e2e
+        run: npx nx run nx-angular-mf-e2e:e2e

.gitignore

@@ -42,3 +42,5 @@ Thumbs.db
 .nx/workspace-data
 
 .angular
+.cursor/rules/nx-rules.mdc
+.github/instructions/nx.instructions.md

.vscode/extensions.json

@@ -3,6 +3,6 @@
     "nrwl.angular-console",
     "esbenp.prettier-vscode",
     "dbaeumer.vscode-eslint",
-    "firsttris.vscode-jest-runner"
+    "vitest.explorer"
   ]
 }

README.md

@@ -1,6 +1,7 @@
 # @klerick/nx-angular-mf
 
 - [Readme about lib](./libs/nx-angular-mf/README.md)
+- [Article about this project](https://dev.to/klerick/custom-builder-for-angular-my-way-12hd)
 
 
 ## Local Development

apps/host-application/project.json

@@ -68,6 +68,9 @@
     "serve": {
       "dependsOn": ["^build"],
       "executor": "./dist/libs/nx-angular-mf:serve",
+      "options": {
+        "port": 4200
+      },
       "configurations": {
         "production": {
           "buildTarget": "host-application:build:production"
@@ -88,10 +91,10 @@
       "executor": "@nx/eslint:lint"
     },
     "test": {
-      "executor": "@nx/jest:jest",
+      "executor": "nx:run-commands",
       "outputs": ["{workspaceRoot}/coverage/{projectRoot}"],
       "options": {
-        "jestConfig": "apps/host-application/jest.config.ts"
+        "command": "vitest run --config apps/host-application/vitest.config.ts"
       }
     },
     "build-static": {

apps/host-application/src/app/app.config.server.ts

@@ -1,14 +1,10 @@
 import { mergeApplicationConfig, ApplicationConfig } from '@angular/core';
-import { provideServerRendering } from '@angular/platform-server';
-import { provideServerRoutesConfig } from '@angular/ssr';
+import { provideServerRendering, withRoutes } from '@angular/ssr';
 import { appConfig } from './app.config';
 import { serverRoutes } from './app.routes.server';
 
 const serverConfig: ApplicationConfig = {
-  providers: [
-    provideServerRendering(),
-    provideServerRoutesConfig(serverRoutes),
-  ],
+  providers: [provideServerRendering(withRoutes(serverRoutes))],
 };
 
 export const config = mergeApplicationConfig(appConfig, serverConfig);

apps/host-application/src/app/nx-welcome.component.ts

@@ -1,9 +1,9 @@
 import { Component, ViewEncapsulation } from '@angular/core';
-import { CommonModule } from '@angular/common';
+
 
 @Component({
   selector: 'app-nx-welcome',
-  imports: [CommonModule],
+  imports: [],
   template: `
     <!--
      * * * * * * * * * * * * * * * * * * * * * * * * * * * *

apps/host-application/src/main.server.ts

@@ -1,7 +1,7 @@
-import { bootstrapApplication } from '@angular/platform-browser';
+import { bootstrapApplication, BootstrapContext } from '@angular/platform-browser';
 import { AppComponent } from './app/app.component';
 import { config } from './app/app.config.server';
 
-const bootstrap = () => bootstrapApplication(AppComponent, config);
+const bootstrap = (context: BootstrapContext) => bootstrapApplication(AppComponent, config, context);
 
 export default bootstrap;

apps/host-application/tsconfig.app.json

@@ -2,22 +2,15 @@
   "extends": "./tsconfig.json",
   "compilerOptions": {
     "outDir": "../../dist/out-tsc",
-    "types": [
-      "node"
-    ]
+    "types": ["node"],
+    "moduleResolution": "bundler"
   },
   "files": [
     "src/main.ts",
     "src/main.server.ts",
     "src/server.ts",
     "../../libs/test-shared-library/src/index.ts"
   ],
-  "include": [
-    "src/**/*.d.ts"
-  ],
-  "exclude": [
-    "jest.config.ts",
-    "src/**/*.test.ts",
-    "src/**/*.spec.ts"
-  ]
+  "include": ["src/**/*.d.ts"],
+  "exclude": ["vitest.config.ts", "src/**/*.test.ts", "src/**/*.spec.ts"]
 }

apps/host-application/tsconfig.editor.json

@@ -2,5 +2,5 @@
   "extends": "./tsconfig.json",
   "include": ["src/**/*.ts"],
   "compilerOptions": {},
-  "exclude": ["jest.config.ts", "src/**/*.test.ts", "src/**/*.spec.ts"]
+  "exclude": ["vitest.config.ts", "src/**/*.test.ts", "src/**/*.spec.ts"]
 }

apps/mf1-application/.env

@@ -0,0 +1 @@
+DEPLOY_URL=http://loclahost:4201/

apps/mf1-application/project.json

@@ -18,7 +18,8 @@
           "exposes": {
             "FirstRemoteRoute": "/apps/mf1-application/src/app/remote/first/index.ts",
             "SecondRemoteRoute": "/apps/mf1-application/src/app/remote/second/index.ts"
-          }
+          },
+          "deployUrlEnvName": "DEPLOY_URL"
         },
         "outputPath": "dist/apps/mf1-application",
         "index": "apps/mf1-application/src/index.html",
@@ -40,7 +41,7 @@
             {
               "type": "initial",
               "maximumWarning": "500kb",
-              "maximumError": "1mb"
+              "maximumError": "5mb"
             },
             {
               "type": "anyComponentStyle",
@@ -84,10 +85,10 @@
       "executor": "@nx/eslint:lint"
     },
     "test": {
-      "executor": "@nx/jest:jest",
+      "executor": "nx:run-commands",
       "outputs": ["{workspaceRoot}/coverage/{projectRoot}"],
       "options": {
-        "jestConfig": "apps/mf1-application/jest.config.ts"
+        "command": "vitest run --config apps/mf1-application/vitest.config.ts"
       }
     },
     "serve-static": {

apps/mf1-application/src/app/nx-welcome.component.ts

@@ -1,9 +1,9 @@
 import { Component, ViewEncapsulation } from '@angular/core';
-import { CommonModule } from '@angular/common';
+
 
 @Component({
   selector: 'app-nx-welcome',
-  imports: [CommonModule],
+  imports: [],
   template: `
     <!--
      * * * * * * * * * * * * * * * * * * * * * * * * * * * *

apps/mf1-application/src/app/remote/first/first.component.ts

@@ -1,10 +1,10 @@
 import { ChangeDetectionStrategy, Component } from '@angular/core';
-import { CommonModule } from '@angular/common';
+
 import { TestSharedLibraryComponent } from '@nx-angular-mf/test-shared-library';
 
 @Component({
   selector: 'app-first',
-  imports: [CommonModule, TestSharedLibraryComponent],
+  imports: [TestSharedLibraryComponent],
   templateUrl: './first.component.html',
   styleUrl: './first.component.css',
   changeDetection: ChangeDetectionStrategy.OnPush,

apps/mf1-application/src/app/remote/second/second.component.ts

@@ -1,9 +1,9 @@
 import { ChangeDetectionStrategy, Component } from '@angular/core';
-import { CommonModule } from '@angular/common';
+
 
 @Component({
   selector: 'app-second',
-  imports: [CommonModule],
+  imports: [],
   templateUrl: './second.component.html',
   styleUrl: './second.component.css',
   changeDetection: ChangeDetectionStrategy.OnPush,

apps/mf1-application/tsconfig.app.json

@@ -2,20 +2,15 @@
   "extends": "./tsconfig.json",
   "compilerOptions": {
     "outDir": "../../dist/out-tsc",
-    "types": []
+    "types": [],
+    "moduleResolution": "bundler"
   },
   "files": [
     "src/main.ts",
     "src/app/remote/second/index.ts",
     "../../libs/nx-angular-mf/src/loadModule.ts",
     "../../libs/nx-angular-mf/src/index.ts"
   ],
-  "include": [
-    "src/**/*.d.ts"
-  ],
-  "exclude": [
-    "jest.config.ts",
-    "src/**/*.test.ts",
-    "src/**/*.spec.ts"
-  ]
+  "include": ["src/**/*.d.ts"],
+  "exclude": ["vitest.config.ts", "src/**/*.test.ts", "src/**/*.spec.ts"]
 }

apps/mf1-application/tsconfig.editor.json

@@ -2,5 +2,5 @@
   "extends": "./tsconfig.json",
   "include": ["src/**/*.ts"],
   "compilerOptions": {},
-  "exclude": ["jest.config.ts", "src/**/*.test.ts", "src/**/*.spec.ts"]
+  "exclude": ["vitest.config.ts", "src/**/*.test.ts", "src/**/*.spec.ts"]
 }

apps/mf2-application/.env

@@ -0,0 +1 @@
+DEPLOY_URL=http://loclahost:4202/

apps/mf2-application/project.json

@@ -52,6 +52,9 @@
     "serve": {
       "dependsOn": ["^build"],
       "executor": "./dist/libs/nx-angular-mf:serve",
+      "options": {
+        "port": 4202
+      },
       "configurations": {
         "production": {
           "buildTarget": "mf2-application:build:production"
@@ -72,10 +75,10 @@
       "executor": "@nx/eslint:lint"
     },
     "test": {
-      "executor": "@nx/jest:jest",
+      "executor": "nx:run-commands",
       "outputs": ["{workspaceRoot}/coverage/{projectRoot}"],
       "options": {
-        "jestConfig": "apps/mf2-application/jest.config.ts"
+        "command": "vitest run --config apps/mf2-application/vitest.config.ts"
       }
     },
     "serve-static": {

apps/mf2-application/src/app/nx-welcome.component.ts

@@ -1,9 +1,9 @@
 import { Component, ViewEncapsulation } from '@angular/core';
-import { CommonModule } from '@angular/common';
+
 
 @Component({
   selector: 'app-nx-welcome',
-  imports: [CommonModule],
+  imports: [],
   template: `
     <!--
      * * * * * * * * * * * * * * * * * * * * * * * * * * * *