@nativescript/vite 8.0.0-alpha.1 → 8.0.0-alpha.11

package/configuration/angular.js

@@ -4,14 +4,42 @@ import fs from 'node:fs';
 import { createRequire } from 'node:module';
 import angular from '@analogjs/vite-plugin-angular';
 import { angularLinkerVitePlugin, angularLinkerVitePluginPost } from '../helpers/angular/angular-linker.js';
-import { ensureSharedAngularLinker } from '../helpers/angular/shared-linker.js';
-import { containsRealNgDeclare } from '../helpers/angular/util.js';
+import { synthesizeMissingInjectableFactories } from '../helpers/angular/synthesize-injectable-factories.js';
+import { ensureSharedAngularLinker, resolveAngularFileSystem } from '../helpers/angular/shared-linker.js';
+import { inlineDecoratorComponentTemplates } from '../helpers/angular/inline-decorator-component-templates.js';
+import { appendComponentHmrRegistration, findComponentClassNames, INJECTION_MARKER as HMR_REGISTER_MARKER } from '../helpers/angular/inject-component-hmr-registration.js';
+import { synthesizeDecoratorCtorParameters } from '../helpers/angular/synthesize-decorator-ctor-parameters.js';
+import { containsRealNgDeclare, stripJsComments } from '../helpers/angular/util.js';
 import { baseConfig } from './base.js';
 import { getCliFlags } from '../helpers/cli-flags.js';
+import { resolveRelativeToImportMeta } from '../helpers/import-meta-path.js';
+import { resolveVerboseFlag } from '../helpers/logging.js';
+// Lazily import the Angular linker factory function. Used by chunk-level linkers
+// to create FRESH plugin instances per invocation (avoiding stale state in watch mode).
+let _cachedLinkerFactory = null;
+async function importLinkerFactory() {
+    if (_cachedLinkerFactory)
+        return _cachedLinkerFactory;
+    const req = createRequire(process.cwd() + '/package.json');
+    try {
+        const linkerPath = req.resolve('@angular/compiler-cli/linker/babel');
+        const linkerMod = await import(linkerPath);
+        _cachedLinkerFactory = linkerMod.createLinkerPlugin || linkerMod.createEs2015LinkerPlugin || null;
+    }
+    catch {
+        try {
+            const linkerMod = await import('@angular/compiler-cli/linker/babel');
+            _cachedLinkerFactory = linkerMod.createLinkerPlugin || linkerMod.createEs2015LinkerPlugin || null;
+        }
+        catch { }
+    }
+    return _cachedLinkerFactory;
+}
 // Rollup-level linker to guarantee Angular libraries are linked when included in the bundle graph.
 function angularRollupLinker(projectRoot) {
     let babel = null;
     let createLinker = null;
+    let angularFileSystem = null;
     const FILTER = /node_modules\/(?:@angular|@nativescript\/angular)\/.*\.[mc]?js$/;
     async function ensureDeps() {
         if (babel && createLinker)
@@ -35,6 +63,9 @@ function angularRollupLinker(projectRoot) {
             }
             catch { }
         }
+        if (!angularFileSystem) {
+            angularFileSystem = await resolveAngularFileSystem(projectRoot);
+        }
     }
     return {
         name: 'ns-angular-linker-rollup',
@@ -56,12 +87,9 @@ function angularRollupLinker(projectRoot) {
                     return null;
                 if (!forceLink && code.indexOf('\u0275\u0275ngDeclare') === -1 && code.indexOf('ɵɵngDeclare') === -1 && code.indexOf('ngDeclare') === -1)
                     return null;
-                const plugin = createLinker({ sourceMapping: false });
+                const plugin = createLinker({ sourceMapping: false, fileSystem: angularFileSystem });
                 if (debug) {
-                    try {
-                        console.log('[ns-angular-linker][rollup-load] linking', cleanId);
-                    }
-                    catch { }
+                    console.log('[ns-angular-linker][rollup-load] linking', cleanId);
                 }
                 const result = await babel.transformAsync(code, {
                     filename: cleanId,
@@ -92,12 +120,9 @@ function angularRollupLinker(projectRoot) {
             if (!babel || !createLinker)
                 return null;
             try {
-                const plugin = createLinker({ sourceMapping: false });
+                const plugin = createLinker({ sourceMapping: false, fileSystem: angularFileSystem });
                 if (debug) {
-                    try {
-                        console.log('[ns-angular-linker][rollup] linking', cleanId);
-                    }
-                    catch { }
+                    console.log('[ns-angular-linker][rollup] linking', cleanId);
                 }
                 const result = await babel.transformAsync(code, {
                     filename: cleanId,
@@ -126,76 +151,367 @@ let tsConfig = tsConfigAppPath;
 if (!fs.existsSync(tsConfigAppPath) && fs.existsSync(tsConfigPath)) {
     tsConfig = tsConfigPath;
 }
-const plugins = [
-    // Allow external html template changes to trigger hot reload: Make .ts files depend on their .html templates
-    {
-        name: 'angular-template-deps',
-        transform(code, id) {
-            // For .ts files that reference templateUrl, add the .html file as a dependency
-            if (id.endsWith('.ts') && code.includes('templateUrl')) {
-                const templateUrlMatch = code.match(/templateUrl:\s*['"]\.\/(.*?\.html)['"]/);
-                if (templateUrlMatch) {
-                    const htmlPath = path.resolve(path.dirname(id), templateUrlMatch[1]);
-                    // Add the HTML file as a dependency so Vite watches it
-                    this.addWatchFile(htmlPath);
-                }
+function normalizeAngularWatchPath(filePath) {
+    return filePath
+        .split('?', 1)[0]
+        .replace(/\\/g, '/')
+        .replace(/^file:\/\//, '');
+}
+function normalizeAngularWatchKey(filePath) {
+    const normalizedPath = normalizeAngularWatchPath(filePath);
+    const fileSystemPath = normalizedPath.startsWith('/@fs/') ? normalizedPath.slice('/@fs'.length) : normalizedPath;
+    const normalizedProjectRoot = projectRoot.replace(/\\/g, '/').replace(/\/$/, '');
+    if (normalizedProjectRoot && fileSystemPath.startsWith(normalizedProjectRoot)) {
+        const relative = fileSystemPath.slice(normalizedProjectRoot.length);
+        return relative.startsWith('/') ? relative : `/${relative}`;
+    }
+    return fileSystemPath;
+}
+function getAngularWatchKeys(filePath) {
+    const normalizedPath = normalizeAngularWatchPath(filePath);
+    const keys = new Set();
+    keys.add(normalizedPath);
+    keys.add(normalizeAngularWatchKey(normalizedPath));
+    return Array.from(keys).filter(Boolean);
+}
+function resolveAngularWatchFilePath(filePath) {
+    const normalizedPath = normalizeAngularWatchPath(filePath);
+    const fileSystemPath = normalizedPath.startsWith('/@fs/') ? normalizedPath.slice('/@fs'.length) : normalizedPath;
+    if (path.isAbsolute(fileSystemPath) && fs.existsSync(fileSystemPath)) {
+        return fileSystemPath;
+    }
+    if (fileSystemPath.startsWith('/')) {
+        return path.resolve(projectRoot, `.${fileSystemPath}`);
+    }
+    return path.resolve(projectRoot, fileSystemPath);
+}
+function extractComponentAssetPaths(code, componentId) {
+    const componentPath = normalizeAngularWatchPath(componentId);
+    const assetPaths = new Set();
+    const resolveAssetPath = (assetPath) => normalizeAngularWatchPath(path.resolve(path.dirname(componentPath), assetPath));
+    // Blank out `//` and `/* */` comments before scanning. The regexes below
+    // are intentionally simple (no JS parser) so they would otherwise match
+    // commented-out `templateUrl` / `styleUrls` declarations and register
+    // phantom asset deps via `addWatchFile`. In current Rolldown-Vite that
+    // also enrolls them as `_addedImports`, which `vite:import-analysis`
+    // then tries to resolve — surfacing as a misleading
+    // `Failed to resolve import "<file>" from "<importer>". Does the file
+    // exist?` pre-transform error if the file (predictably) doesn't exist.
+    const scanCode = stripJsComments(code);
+    const templateUrlMatch = scanCode.match(/templateUrl\s*:\s*['"](.+?\.(?:html|htm))['"]/);
+    if (templateUrlMatch) {
+        assetPaths.add(resolveAssetPath(templateUrlMatch[1]));
+    }
+    const styleUrlMatch = scanCode.match(/styleUrl\s*:\s*['"](.+?\.(?:css|less|sass|scss))['"]/);
+    if (styleUrlMatch) {
+        assetPaths.add(resolveAssetPath(styleUrlMatch[1]));
+    }
+    const styleUrlsMatch = scanCode.match(/styleUrls\s*:\s*\[([\s\S]*?)\]/m);
+    if (styleUrlsMatch) {
+        for (const match of styleUrlsMatch[1].matchAll(/['"](.+?\.(?:css|less|sass|scss))['"]/g)) {
+            assetPaths.add(resolveAssetPath(match[1]));
+        }
+    }
+    return Array.from(assetPaths);
+}
+function createAngularPlugins(opts) {
+    const verbose = resolveVerboseFlag();
+    const assetToComponents = new Map();
+    const componentToAssets = new Map();
+    const pendingComponentInvalidations = new Set();
+    // Shared state between the `enforce: 'pre'` discovery plugin and the
+    // `enforce: 'post'` injection plugin. Maps a clean (no-querystring)
+    // .ts file id to the list of `@Component`-decorated class names found
+    // in its RAW TypeScript source. The pre plugin populates this map;
+    // the post plugin reads it to know which class names to register
+    // against the compiled output. Cleared on each pre-plugin invocation
+    // so renames or `@Component` removals don't leave stale entries.
+    const componentsByCleanId = new Map();
+    const untrackComponentAssets = (componentPath) => {
+        const previousAssets = componentToAssets.get(componentPath);
+        if (!previousAssets)
+            return;
+        for (const assetPath of previousAssets) {
+            const components = assetToComponents.get(assetPath);
+            if (!components)
+                continue;
+            components.delete(componentPath);
+            if (components.size === 0) {
+                assetToComponents.delete(assetPath);
             }
-            return null;
+        }
+        componentToAssets.delete(componentPath);
+    };
+    const trackComponentAssets = (componentPath, assetPaths) => {
+        untrackComponentAssets(componentPath);
+        if (assetPaths.length === 0)
+            return;
+        const normalizedAssets = new Set(assetPaths.flatMap((assetPath) => getAngularWatchKeys(assetPath)));
+        componentToAssets.set(componentPath, normalizedAssets);
+        for (const assetPath of normalizedAssets) {
+            const components = assetToComponents.get(assetPath) || new Set();
+            components.add(componentPath);
+            assetToComponents.set(assetPath, components);
+        }
+    };
+    const isCandidateComponentTs = (cleanId) => {
+        if (!cleanId.endsWith('.ts'))
+            return false;
+        if (cleanId.includes('/node_modules/'))
+            return false;
+        if (cleanId.endsWith('.d.ts'))
+            return false;
+        if (cleanId.endsWith('.spec.ts') || cleanId.endsWith('.test.ts'))
+            return false;
+        return true;
+    };
+    return [
+        // HMR self-registration runs in two phases:
+        //
+        //   1. (this plugin, `enforce: 'pre'`) Walk the raw TypeScript
+        //      source for each user `.ts` file and record the names of
+        //      any `@Component`-decorated classes into the shared
+        //      `componentsByCleanId` map. Discovery has to happen on the
+        //      raw source because the Analog Angular plugin rewrites
+        //      `@Component(...)` into static metadata calls and removes
+        //      the textual decorator pattern.
+        //
+        //   2. (`ns-component-hmr-register-post`, `enforce: 'post'`)
+        //      After the Analog Angular plugin has compiled the file,
+        //      append the global `__NS_HMR_REGISTER_COMPONENT__`
+        //      registration calls keyed by the names recorded in step 1.
+        //
+        // Why the two-phase split: the Analog Angular plugin's `transform`
+        // returns its OWN regenerated compiled output (from its internal
+        // `outputFiles` cache populated at `buildStart`), discarding any
+        // code modifications applied earlier in the pipeline. We
+        // previously appended the registration snippet here, in the pre
+        // plugin, and the snippet was silently dropped — leaving the
+        // HMR class registry empty and `getFreshComponentClass` returning
+        // `found=false reason=no-registry` after every reboot.
+        //
+        // Placement notes that still apply:
+        //   - `apply: 'serve'`: the registry runtime hook is dev-only;
+        //     production builds never need self-registration.
+        //   - Intentionally NOT gated on `hmrActive`. The injected
+        //     snippet self-guards with
+        //     `typeof globalThis.__NS_HMR_REGISTER_COMPONENT__ === 'function'`,
+        //     so it's a no-op when the runtime hook isn't installed
+        //     (e.g. `--no-hmr` users still serving modules through
+        //     Vite). Gating the transform itself on `hmrActive` produced
+        //     a silent failure mode where `--no-hmr` users got HMR
+        //     machinery up but never got the registration calls
+        //     injected, leaving the registry empty.
+        {
+            name: 'ns-component-hmr-register',
+            enforce: 'pre',
+            apply: 'serve',
+            transform(code, id) {
+                const cleanId = id.split('?', 1)[0];
+                if (!isCandidateComponentTs(cleanId))
+                    return null;
+                const componentNames = findComponentClassNames(code);
+                if (componentNames.length === 0) {
+                    // Drop any stale entry from a previous transform
+                    // pass; the file may have lost its `@Component`
+                    // decorator across a rename/refactor.
+                    componentsByCleanId.delete(cleanId);
+                    return null;
+                }
+                componentsByCleanId.set(cleanId, componentNames);
+                if (verbose) {
+                    console.info(`[ns-hmr-diag][ns-component-hmr-register] discovered ${componentNames.length} component(s) in ${cleanId} (${componentNames.join(', ')})`);
+                }
+                // Discovery only — never modify the raw TS source. Any
+                // modification here is discarded by the Analog Angular
+                // plugin downstream; the actual snippet append happens
+                // in `ns-component-hmr-register-post`.
+                return null;
+            },
         },
-    },
-    // Transform Angular partial declarations in node_modules to avoid runtime JIT
-    // Pass the project root so linker deps resolve from the app, not the plugin package.
-    angularLinkerVitePlugin(process.cwd()),
-    // Simplify: rely on Vite pre plugin (load/transform) for linking; Rollup safety net disabled unless re-enabled later
-    // angularRollupLinker(process.cwd()),
-    angular({
-        liveReload: false, // Disable live reload in favor of HMR
-        tsconfig: tsConfig,
-    }),
-    // Post-phase linker to catch any declarations introduced after other transforms (including project code)
-    angularLinkerVitePluginPost(process.cwd()),
-    // Enforce: fully disable dependency optimization during serve to avoid rxjs esm5 crawling and OOM
-    {
-        name: 'ns-disable-optimize-deps',
-        enforce: 'post',
-        apply: 'serve',
-        config(userConfig) {
-            const od = userConfig?.optimizeDeps || {};
-            const prevExclude = Array.isArray(od.exclude) ? od.exclude : [];
-            const exclude = new Set(prevExclude);
-            ['@nativescript/core', 'rxjs', '@valor/nativescript-websockets', 'set-value', 'react', 'react-reconciler', 'react-nativescript'].forEach((x) => exclude.add(x));
-            return {
-                optimizeDeps: {
-                    noDiscovery: true,
-                    entries: [],
-                    include: [],
-                    exclude: Array.from(exclude),
-                    rolldownOptions: {
-                        ...(od.rolldownOptions || {}),
-                        plugins: [],
-                    },
-                },
-            };
+        // Phase 2: append the HMR registration snippet to the compiled
+        // JS output produced by `@analogjs/vite-plugin-angular`. Runs
+        // `enforce: 'post'` so we see the post-Angular code (where the
+        // pre plugin's work would otherwise be discarded). Reads the
+        // component names recorded by the pre plugin via
+        // `componentsByCleanId`.
+        {
+            name: 'ns-component-hmr-register-post',
+            enforce: 'post',
+            apply: 'serve',
+            transform(code, id) {
+                const cleanId = id.split('?', 1)[0];
+                if (!isCandidateComponentTs(cleanId))
+                    return null;
+                const componentNames = componentsByCleanId.get(cleanId);
+                if (!componentNames || componentNames.length === 0)
+                    return null;
+                // Idempotency: the Vite cache may replay the transform
+                // pipeline on cached modules. The marker comment is
+                // inserted by `appendComponentHmrRegistration` and
+                // guards against double-injection. We also defensively
+                // short-circuit here so we don't have to allocate the
+                // suffix string on every cached re-run.
+                if (code.includes(HMR_REGISTER_MARKER))
+                    return null;
+                const result = appendComponentHmrRegistration(code, componentNames);
+                if (!result.code)
+                    return null;
+                if (verbose) {
+                    console.info(`[ns-hmr-diag][ns-component-hmr-register-post] appended registrations for ${result.componentNames.length} component(s) in ${cleanId} (${result.componentNames.join(', ')})`);
+                }
+                // Returning `null` for the source map is acceptable for
+                // dev: lines 1..N (the original compiled body) keep
+                // the upstream Angular source map; the appended snippet
+                // is invisible to debuggers but harmless. For
+                // production-grade source maps a MagicString-based
+                // pass-through could be used; not required for HMR.
+                return { code: result.code, map: null };
+            },
+        },
+        // Allow external html template changes to trigger hot reload: Make .ts files depend on their .html templates
+        {
+            name: 'angular-template-deps',
+            enforce: 'pre',
+            transform(code, id) {
+                const componentPath = normalizeAngularWatchPath(id);
+                const componentKey = normalizeAngularWatchKey(id);
+                if (!componentKey.endsWith('.ts'))
+                    return null;
+                const assetPaths = extractComponentAssetPaths(code, componentPath);
+                trackComponentAssets(componentKey, assetPaths);
+                for (const assetPath of assetPaths) {
+                    this.addWatchFile(assetPath);
+                }
+                // Diagnostic: surface which .ts files we've registered
+                // asset (template/styleUrls) dependencies for. This is
+                // the first fence the HTML→TS invalidation pipeline must
+                // pass — if we never see a [tracking] log for the
+                // component we're editing, the watcher will never fire
+                // and `pendingComponentInvalidations` stays empty.
+                if (verbose) {
+                    console.info(`[ns-hmr-diag][angular-template-deps] [tracking] componentKey=${componentKey} assets=${assetPaths.length} (${assetPaths.slice(0, 4).join(', ')})`);
+                }
+                return null;
+            },
+            watchChange(id) {
+                const changedPath = normalizeAngularWatchPath(id);
+                const components = new Set();
+                for (const assetKey of getAngularWatchKeys(changedPath)) {
+                    for (const componentPath of assetToComponents.get(assetKey) || []) {
+                        components.add(componentPath);
+                    }
+                }
+                if (components?.size) {
+                    for (const componentPath of components) {
+                        pendingComponentInvalidations.add(componentPath);
+                    }
+                    if (verbose) {
+                        console.info(`[ns-hmr-diag][angular-template-deps] watchChange [via assetToComponents] changed=${changedPath} → invalidating ${components.size} component(s):`, Array.from(components));
+                    }
+                    return;
+                }
+                if (/\.(html|htm)$/i.test(changedPath)) {
+                    const componentPath = changedPath.replace(/\.(html|htm)$/i, '.ts');
+                    const exists = fs.existsSync(resolveAngularWatchFilePath(componentPath));
+                    if (exists) {
+                        const componentKey = normalizeAngularWatchKey(componentPath);
+                        pendingComponentInvalidations.add(componentKey);
+                        if (verbose) {
+                            console.info(`[ns-hmr-diag][angular-template-deps] watchChange [via fallback .html→.ts] changed=${changedPath} componentKey=${componentKey}`);
+                        }
+                    }
+                    else if (verbose) {
+                        console.info(`[ns-hmr-diag][angular-template-deps] watchChange [no companion .ts found] changed=${changedPath} expectedTs=${componentPath}`);
+                    }
+                }
+            },
+            shouldTransformCachedModule({ id }) {
+                const componentPath = normalizeAngularWatchKey(id);
+                if (!pendingComponentInvalidations.has(componentPath))
+                    return null;
+                pendingComponentInvalidations.delete(componentPath);
+                if (verbose) {
+                    console.info(`[ns-hmr-diag][angular-template-deps] shouldTransformCachedModule → re-transform componentKey=${componentPath}`);
+                }
+                return true;
+            },
         },
-        configResolved(resolved) {
-            const deps = (resolved.optimizeDeps || (resolved.optimizeDeps = {}));
-            deps.noDiscovery = true;
-            deps.entries = [];
-            deps.include = [];
-            const exclude = new Set(Array.isArray(deps.exclude) ? deps.exclude : []);
-            ['@nativescript/core', 'rxjs', '@valor/nativescript-websockets', 'set-value', 'react', 'react-reconciler', 'react-nativescript'].forEach((x) => exclude.add(x));
-            deps.exclude = Array.from(exclude);
-            const rolldownOptions = (deps.rolldownOptions || (deps.rolldownOptions = {}));
-            rolldownOptions.plugins = [];
+        // Transform Angular partial declarations in node_modules to avoid runtime JIT
+        // Pass the project root so linker deps resolve from the app, not the plugin package.
+        angularLinkerVitePlugin(process.cwd()),
+        // Simplify: rely on Vite pre plugin (load/transform) for linking; Rollup safety net disabled unless re-enabled later
+        // angularRollupLinker(process.cwd()),
+        ...angular({
+            experimental: {
+                useAngularCompilationAPI: opts.useAngularCompilationAPI,
+            },
+            liveReload: false, // Disable live reload in favor of HMR
+            tsconfig: tsConfig,
+        }),
+        // Post-phase linker to catch any declarations introduced after other transforms (including project code)
+        angularLinkerVitePluginPost(process.cwd()),
+        // Enforce: fully disable dependency optimization during serve to avoid rxjs esm5 crawling and OOM
+        {
+            name: 'ns-disable-optimize-deps',
+            enforce: 'post',
+            apply: 'serve',
+            config(userConfig) {
+                const od = userConfig?.optimizeDeps || {};
+                const prevExclude = Array.isArray(od.exclude) ? od.exclude : [];
+                const exclude = new Set(prevExclude);
+                ['@nativescript/core', 'rxjs', '@valor/nativescript-websockets', 'set-value', 'react', 'react-reconciler', 'react-nativescript'].forEach((x) => exclude.add(x));
+                return {
+                    optimizeDeps: {
+                        noDiscovery: true,
+                        entries: [],
+                        include: [],
+                        exclude: Array.from(exclude),
+                        rolldownOptions: {
+                            ...(od.rolldownOptions || {}),
+                            plugins: [],
+                        },
+                    },
+                };
+            },
+            configResolved(resolved) {
+                const resolvedConfig = resolved;
+                const deps = (resolvedConfig.optimizeDeps || (resolvedConfig.optimizeDeps = {}));
+                deps.noDiscovery = true;
+                deps.entries = [];
+                deps.include = [];
+                const exclude = new Set(Array.isArray(deps.exclude) ? deps.exclude : []);
+                ['@nativescript/core', 'rxjs', '@valor/nativescript-websockets', 'set-value', 'react', 'react-reconciler', 'react-nativescript'].forEach((x) => exclude.add(x));
+                deps.exclude = Array.from(exclude);
+                const rolldownOptions = (deps.rolldownOptions || (deps.rolldownOptions = {}));
+                rolldownOptions.plugins = [];
+            },
         },
-    },
-];
+    ];
+}
 export const angularConfig = ({ mode }) => {
+    const useSingleBundleDevOutput = mode === 'development' && !hmrActive;
+    const plugins = createAngularPlugins({
+        // Vite build --watch with the legacy Analog compilation path can regress
+        // Angular app sources from Ivy output back to decorator emit on rebuild.
+        // Restrict the newer compilation API to NativeScript's development no-HMR
+        // flow, which is where the unstable rebuilds occur today.
+        useAngularCompilationAPI: useSingleBundleDevOutput,
+    });
     const disableAnimations = true;
     //process.env.NS_DISABLE_NG_ANIMATIONS === "1" ||
     //process.env.NS_DISABLE_NG_ANIMATIONS === "true";
     // Post-link emitted chunks to catch any remaining partial declarations that slipped through
     // due to plugin order or external transforms.
+    const applyAngularChunkPostProcessing = (code, options = {}) => {
+        const codeWithInjectables = synthesizeMissingInjectableFactories(code, {
+            vendorInjectExport: options.vendorInjectExport,
+        });
+        const codeWithCtorParameters = synthesizeDecoratorCtorParameters(codeWithInjectables);
+        return inlineDecoratorComponentTemplates(codeWithCtorParameters, {
+            projectRoot: process.cwd(),
+        });
+    };
     const postLinker = {
         name: 'ns-angular-linker-post',
         apply: 'build',
@@ -206,13 +522,22 @@ export const angularConfig = ({ mode }) => {
                     return false;
                 return Object.keys(chunk.modules).some((m) => m.includes('node_modules/@nativescript/angular/fesm2022/nativescript-angular-polyfills.mjs'));
             }
-            const { babel, linkerPlugin } = await ensureSharedAngularLinker(process.cwd());
-            if (!babel || !linkerPlugin)
+            const { babel } = await ensureSharedAngularLinker(process.cwd());
+            if (!babel)
+                return;
+            const fileSystem = await resolveAngularFileSystem(process.cwd());
+            const linkerFactory = await importLinkerFactory();
+            if (!linkerFactory)
                 return;
             const strict = process.env.NS_STRICT_NG_LINK === '1' || process.env.NS_STRICT_NG_LINK === 'true';
             const enforceStrict = process.env.NS_STRICT_NG_LINK_ENFORCE === '1' || process.env.NS_STRICT_NG_LINK_ENFORCE === 'true';
             const debug = process.env.VITE_DEBUG_LOGS === '1' || process.env.VITE_DEBUG_LOGS === 'true';
             const unlinked = [];
+            const vendorInjectExport = (() => {
+                const vendorChunk = Object.entries(bundle).find(([name, value]) => value && value.type === 'chunk' && /(^|\/)vendor\.mjs$/.test(name));
+                const vendorCode = vendorChunk ? vendorChunk[1].code : undefined;
+                return vendorCode?.match(/\binject as ([A-Za-z_$][\w$]*)/)?.[1];
+            })();
             for (const [fileName, chunk] of Object.entries(bundle)) {
                 if (!fileName.endsWith('.mjs') && !fileName.endsWith('.js'))
                     continue;
@@ -222,29 +547,31 @@ export const angularConfig = ({ mode }) => {
                         continue;
                     const isNsPolyfills = isNsAngularPolyfillsChunk(chunk);
                     try {
+                        // Create a FRESH linker plugin per chunk — the linker may have
+                        // internal state that becomes stale across watch-mode rebuild cycles.
+                        const freshPlugin = linkerFactory({ sourceMapping: false, fileSystem });
                         const res = await babel.transformAsync(code, {
                             filename: fileName,
                             configFile: false,
                             babelrc: false,
                             sourceMaps: false,
                             compact: false,
-                            plugins: [linkerPlugin],
+                            plugins: [freshPlugin],
                         });
-                        const finalCode = res?.code && res.code !== code ? res.code : code;
+                        const linkedCode = res?.code && res.code !== code ? res.code : code;
+                        const finalCode = applyAngularChunkPostProcessing(linkedCode, { vendorInjectExport });
                         if (finalCode !== code) {
                             chunk.code = finalCode;
                             if (debug) {
-                                try {
-                                    console.log('[ns-angular-linker][post] linked', fileName, isNsPolyfills ? '(polyfills)' : '');
-                                }
-                                catch { }
+                                console.log('[ns-angular-linker][post] linked', fileName, isNsPolyfills ? '(polyfills)' : '');
                             }
                         }
                         if (strict && !isNsPolyfills && containsRealNgDeclare(finalCode)) {
                             unlinked.push(fileName);
                         }
                     }
-                    catch {
+                    catch (e) {
+                        console.warn(`[ns-angular-linker][post] linking FAILED for ${fileName}:`, e?.message || e);
                         if (strict)
                             unlinked.push(fileName);
                     }
@@ -282,89 +609,94 @@ export const angularConfig = ({ mode }) => {
                     throw new Error(message);
                 }
                 else {
-                    try {
-                        console.warn(`[ns-angular-linker-post] ${message}`);
-                    }
-                    catch { }
+                    console.warn(`[ns-angular-linker-post] ${message}`);
                 }
             }
         },
     };
-    // Safety net: transform each rendered chunk to link any remaining ɵɵngDeclare* call sites
+    // Safety net: transform each rendered chunk to link any remaining ɵɵngDeclare* call sites.
+    // IMPORTANT: create a FRESH linker plugin per invocation — the shared instance may have
+    // stale internal state from a prior build cycle, causing silent failures in watch-mode rebuilds.
     const renderChunkLinker = {
         name: 'ns-angular-linker-render',
         apply: 'build',
         enforce: 'post',
         async renderChunk(code, chunk) {
+            if (!code)
+                return null;
+            const filename = chunk.fileName || chunk.name || 'chunk.mjs';
+            const debug = process.env.VITE_DEBUG_LOGS === '1' || process.env.VITE_DEBUG_LOGS === 'true';
             try {
-                if (!code)
-                    return null;
-                if (!containsRealNgDeclare(code))
-                    return null;
-                const { babel, linkerPlugin } = await ensureSharedAngularLinker(process.cwd());
-                if (!babel || !linkerPlugin)
-                    return null;
-                const filename = chunk.fileName || chunk.name || 'chunk.mjs';
-                const debug = process.env.VITE_DEBUG_LOGS === '1' || process.env.VITE_DEBUG_LOGS === 'true';
-                const runLink = async (input) => {
-                    const result = await babel.transformAsync(input, {
-                        filename,
-                        configFile: false,
-                        babelrc: false,
-                        sourceMaps: false,
-                        compact: false,
-                        plugins: [linkerPlugin],
-                    });
-                    return result?.code ?? input;
-                };
-                let transformed = await runLink(code);
-                if (containsRealNgDeclare(transformed)) {
-                    transformed = await runLink(transformed);
+                let transformed = code;
+                if (containsRealNgDeclare(code)) {
+                    const { babel } = await ensureSharedAngularLinker(process.cwd());
+                    if (!babel)
+                        return null;
+                    const fileSystem = await resolveAngularFileSystem(process.cwd());
+                    // Fresh plugin per chunk — avoids stale linker state across watch-mode rebuilds
+                    const freshPlugin = (await importLinkerFactory())?.({ sourceMapping: false, fileSystem });
+                    if (!freshPlugin)
+                        return null;
+                    const runLink = async (input) => {
+                        const result = await babel.transformAsync(input, {
+                            filename,
+                            configFile: false,
+                            babelrc: false,
+                            sourceMaps: false,
+                            compact: false,
+                            plugins: [freshPlugin],
+                        });
+                        return result?.code ?? input;
+                    };
+                    transformed = await runLink(code);
+                    if (containsRealNgDeclare(transformed)) {
+                        transformed = await runLink(transformed);
+                    }
                 }
+                transformed = applyAngularChunkPostProcessing(transformed);
                 if (transformed !== code) {
                     if (debug) {
-                        try {
-                            console.log('[ns-angular-linker][render] linked', filename);
-                        }
-                        catch { }
+                        console.log('[ns-angular-linker][render] linked', filename);
                     }
                     return { code: transformed, map: null };
                 }
             }
-            catch { }
+            catch (e) {
+                console.warn(`[ns-angular-linker][render] linking FAILED for ${filename}:`, e?.message || e);
+            }
             return null;
         },
     };
     const enableRollupLinker = process.env.NS_ENABLE_ROLLUP_LINKER === '1' || process.env.NS_ENABLE_ROLLUP_LINKER === 'true' || hmrActive;
-    return mergeConfig(baseConfig({ mode, flavor: 'angular' }), {
+    // Build a single merged alias array to avoid property override conflicts.
+    // Previously the disableAnimations spread added a second `resolve` key
+    // that silently clobbered the fesm2022 and RxJS aliases.
+    const angularAliases = [
+        // Map Angular deep ESM paths to bare package ids
+        { find: /^@angular\/([^/]+)\/fesm2022\/.*\.mjs$/, replacement: '@angular/$1' },
+        { find: /^@nativescript\/angular\/fesm2022\/.*\.mjs$/, replacement: '@nativescript/angular' },
+        // RxJS esm5 → esm redirects removed: Vite 8 enforces the rxjs `exports` field,
+        // blocking deep path aliases. Instead, the `es2015` resolve condition is added
+        // below so rxjs resolves to its modern ESM builds via the exports map.
+    ];
+    if (disableAnimations) {
+        angularAliases.push({
+            find: /^@angular\/animations(\/.+)?$/, // match subpaths too
+            replacement: resolveRelativeToImportMeta(import.meta.url, '../shims/angular-animations-stub.js'),
+        }, {
+            find: /^@angular\/platform-browser\/animations(\/.+)?$/,
+            replacement: resolveRelativeToImportMeta(import.meta.url, '../shims/angular-animations-stub.js'),
+        });
+    }
+    const config = mergeConfig(baseConfig({ mode, flavor: 'angular' }), {
         plugins: [...plugins, ...(enableRollupLinker ? [angularRollupLinker(process.cwd())] : []), renderChunkLinker, postLinker],
-        // Always alias fesm2022 deep imports to package root so vendor bridge can externalize properly
         resolve: {
-            alias: [
-                // Map Angular deep ESM paths to bare package ids
-                { find: /^@angular\/([^/]+)\/fesm2022\/.*\.mjs$/, replacement: '@angular/$1' },
-                { find: /^@nativescript\/angular\/fesm2022\/.*\.mjs$/, replacement: '@nativescript/angular' },
-                // Prefer modern RxJS builds; avoid esm5 which explodes module count and memory
-                { find: /^rxjs\/dist\/esm5\/(.*)$/, replacement: 'rxjs/dist/esm2015/$1' },
-                { find: /^rxjs\/operators$/, replacement: 'rxjs/dist/esm2015/operators/index.js' },
-                { find: /^rxjs$/, replacement: 'rxjs/dist/esm2015/index.js' },
-                // Existing optional animations shims
-            ],
+            alias: angularAliases,
+            // Add 'es2015' condition so RxJS resolves to dist/esm (modern ESM) rather
+            // than dist/esm5 via the 'default' condition. This avoids the esm5 module
+            // explosion and OOM while respecting the package's exports field in Vite 8.
+            conditions: ['es2015'],
         },
-        ...(disableAnimations && {
-            resolve: {
-                alias: [
-                    {
-                        find: /^@angular\/animations(\/.+)?$/, // match subpaths too
-                        replacement: new URL('../shims/angular-animations-stub.js', import.meta.url).pathname,
-                    },
-                    {
-                        find: /^@angular\/platform-browser\/animations(\/.+)?$/,
-                        replacement: new URL('../shims/angular-animations-stub.js', import.meta.url).pathname,
-                    },
-                ],
-            },
-        }),
         // Disable dependency optimization entirely for NativeScript Angular HMR.
         // Vite 5.1+: use noDiscovery with an empty include list (disabled was removed).
         // The HTTP loader + vendor bridge manage dependencies; pre-bundling can OOM.
@@ -376,5 +708,19 @@ export const angularConfig = ({ mode }) => {
             rolldownOptions: { plugins: [] },
         },
     });
+    if (useSingleBundleDevOutput) {
+        const build = (config.build ?? (config.build = {}));
+        const rolldownOptions = (build.rolldownOptions ?? (build.rolldownOptions = {}));
+        const outputConfigs = Array.isArray(rolldownOptions.output) ? rolldownOptions.output : [rolldownOptions.output ?? {}];
+        for (const output of outputConfigs) {
+            // Angular non-HMR reloads are more reliable when rebuilds keep a single boot bundle.
+            // This avoids watch-time chunk alias/name drift that can leave the native app reloading into stale split points.
+            delete output.manualChunks;
+            delete output.chunkFileNames;
+            output.codeSplitting = false;
+        }
+        rolldownOptions.output = Array.isArray(rolldownOptions.output) ? outputConfigs : outputConfigs[0];
+    }
+    return config;
 };
 //# sourceMappingURL=angular.js.map