@nativescript/vite 0.0.1-alpha.0 → 0.0.1-alpha.1

package/dist/configuration/base.js

@@ -18,6 +18,7 @@ import { hmrPlugin, cliPlugin } from "../helpers/ns-cli-plugins.js";
 import { dynamicImportPlugin } from "../helpers/dynamic-import-plugin.js";
 import { mainEntryPlugin } from "../helpers/main-entry.js";
 import { determineProjectFlavor } from "../helpers/flavor.js";
+import { preserveImportsPlugin } from "../helpers/preserve-imports.js";
 import { externalConfigMerges, applyExternalConfigs, } from "../helpers/external-configs.js";
 const debugViteLogs = !!process.env.VITE_DEBUG_PATHS;
 const projectRoot = getProjectRootPath();
@@ -36,7 +37,7 @@ export const baseConfig = ({ mode }) => {
         obj[rawKey] = rest.length === 0 ? true : rest.join("=");
         return obj;
     }, {});
-    console.log("cliFlags:", cliFlags);
+    // console.log("cliFlags:", cliFlags);
     const debug = !!cliFlags.viteDebug || !!process.env.DEBUG || targetMode === "development";
     if (debug) {
         console.log("--------------");
@@ -50,6 +51,25 @@ export const baseConfig = ({ mode }) => {
     // Create TypeScript aliases with platform support
     const tsConfigData = getTsConfigData(debugViteLogs, platform);
     // Common resolve configuration for both main and worker builds
+    // Build platform-aware extension preference order and exclude the opposite platform
+    const platformExtensions = (() => {
+        const base = [".tsx", ".jsx", ".ts", ".js"];
+        const exts = [];
+        if (platform === "android") {
+            exts.push(".android.tsx", ".tsx", ".android.jsx", ".jsx", ".android.ts", ".ts", ".android.js", ".js");
+        }
+        else if (platform === "ios" || platform === "visionos") {
+            // Treat visionOS like iOS for file resolution
+            exts.push(".ios.tsx", ".tsx", ".ios.jsx", ".jsx", ".ios.ts", ".ts", ".ios.js", ".js");
+        }
+        else {
+            // Fallback: no platform-specific preference
+            exts.push(...base);
+        }
+        // Always allow these last
+        exts.push(".mjs", ".json");
+        return exts;
+    })();
     const resolveConfig = {
         // ensures Vite prefers ESM entry‑points
         mainFields: ["module", "main"],
@@ -73,22 +93,7 @@ export const baseConfig = ({ mode }) => {
             // optional: "@" → src/
             { find: "@", replacement: path.resolve(projectRoot, "src") },
         ],
-        extensions: [
-            ".ios.tsx",
-            ".android.tsx",
-            ".tsx",
-            ".ios.jsx",
-            ".android.jsx",
-            ".jsx",
-            ".ios.ts",
-            ".android.ts",
-            ".ts",
-            ".ios.js",
-            ".android.js",
-            ".js",
-            ".mjs",
-            ".json",
-        ],
+        extensions: platformExtensions,
         preserveSymlinks: true,
     };
     // Common define configuration for both main and worker builds
@@ -136,8 +141,16 @@ export const baseConfig = ({ mode }) => {
                     global: "globalThis",
                 },
             },
+            // Avoid pre-bundling NativeScript core to prevent esbuild from stripping side-effectful modules
+            exclude: [
+                "@nativescript/core",
+                "@nativescript/core/ui/frame",
+                "@nativescript/core/ui/frame/activity",
+            ],
         },
         plugins: [
+            // Ensure explicit keep markers are honored
+            preserveImportsPlugin(),
             // TODO: make flavor plugins dynamic
             // ...flavorPlugins,
             ...commonjsPlugins,
@@ -151,14 +164,12 @@ export const baseConfig = ({ mode }) => {
                 defaultIsModuleExports: "auto",
                 transformMixedEsModules: true,
                 // Ignore optional dependencies that are meant to fail gracefully
-                ignore: [
-                    "@nativescript/android",
-                    "@nativescript/ios",
-                ],
+                ignore: ["@nativescript/android", "@nativescript/ios"],
             }),
             nsConfigAsJsonPlugin(),
             NativeScriptPlugin({ platform }),
-            mainEntryPlugin(cliFlags, debug),
+            // Ensure globals and Android activity are included early via virtual entry
+            mainEntryPlugin(cliFlags, debug, platform),
             dynamicImportPlugin(),
             // Transform Vite worker URLs to NativeScript format AFTER bundling
             workerUrlPlugin(),
@@ -221,6 +232,11 @@ export const baseConfig = ({ mode }) => {
                 include: [/node_modules/],
             },
             rollupOptions: {
+                treeshake: {
+                    // Preserve side effects for NativeScript core so classes/functions
+                    // aren't tree-shaken out of vendor.mjs.
+                    moduleSideEffects: (id) => /node_modules[\\\/]\@nativescript[\\\/]core[\\\/]/.test(id) || null,
+                },
                 input: "virtual:entry-with-polyfills",
                 output: {
                     dir: path.resolve(projectRoot, "dist"),
@@ -239,19 +255,12 @@ export const baseConfig = ({ mode }) => {
                     // Create single vendor chunk - no separate globals chunk to avoid circular deps
                     manualChunks(id) {
                         if (id.includes("node_modules")) {
-                            // Note: this is work in progress on best setup
-                            // Keep polyfills and Zone-dependent packages in main bundle to ensure correct execution order
-                            if ([
-                                "@nativescript/core",
-                                "@nativescript/angular",
-                                "@nativescript/zone-js",
-                                "@valor/nativescript-websockets",
-                                "make-error",
-                                // "source-map-js",
-                                "zone.js",
-                                "/globals",
-                                "/polyfills",
-                            ].includes(id)) {
+                            // Keep common dependencies in the main bundle
+                            // Very Important: keep Angular, NS Angular and core in main bundle to avoid issues with DI
+                            // All flavors can do same if encounter ordering issues
+                            if (id.includes("@angular/") ||
+                                id.includes("@nativescript/angular") ||
+                                id.includes("@nativescript/core")) {
                                 return undefined; // Keep in main bundle
                             }
                             return "vendor";

package/dist/helpers/main-entry.d.ts

@@ -1,4 +1,4 @@
-export declare function mainEntryPlugin(cliFlags: any, debug?: boolean): {
+export declare function mainEntryPlugin(cliFlags: any, debug?: boolean, platform?: "ios" | "android" | "visionos"): {
     name: string;
     resolveId(id: any): string;
     load(id: any): string;

package/dist/helpers/main-entry.js

@@ -16,9 +16,9 @@ const polyfillsPath = getProjectFilePath("src/polyfills.ts");
 const polyfillsExists = fs.existsSync(polyfillsPath);
 // console.log("polyfillsPath:", polyfillsPath);
 // console.log("polyfillsExists:", polyfillsExists);
-const VIRTUAL_ID = 'virtual:entry-with-polyfills';
-const RESOLVED = '\0' + VIRTUAL_ID;
-export function mainEntryPlugin(cliFlags, debug) {
+const VIRTUAL_ID = "virtual:entry-with-polyfills";
+const RESOLVED = "\0" + VIRTUAL_ID;
+export function mainEntryPlugin(cliFlags, debug, platform) {
     return {
         name: "main-entry",
         resolveId(id) {
@@ -30,43 +30,86 @@ export function mainEntryPlugin(cliFlags, debug) {
         load(id) {
             if (id === RESOLVED) {
                 let imports = "";
+                // Align with webpack entry order: core globals and bundle entry points first
+                imports += `import '@nativescript/core/globals/index';\n`;
+                // // explicit extension helps some bundlers to retain side effects
+                imports += `import '@nativescript/core/bundle-entry-points';\n`;
+                // Ensure Android app components are included
+                if (platform === "android") {
+                    // Import explicit Android variants with extension to avoid resolution ambiguity
+                    imports += `import * as __ns_android_frame from '@nativescript/core/ui/frame/index.android.js?ns-keep';\n`;
+                    imports += `import * as __ns_android_activity from '@nativescript/core/ui/frame/activity.android.js?ns-keep';\n`;
+                    // Reference bindings to keep the modules in the graph even if they only have side effects
+                    imports += `void __ns_android_frame; void __ns_android_activity;\n`;
+                    // This may still be needed - needs more testing
+                    // Ensure commonly tree-shaken Android UI modules are included so SBG
+                    // discovers their Java listener/impl classes. Keep imports minimal but
+                    // comprehensive across the missing bindings list.
+                    // const __ns_android_modules = [
+                    //   "@nativescript/core/application",
+                    //   "@nativescript/core/text",
+                    //   "@nativescript/core/timer",
+                    //   "@nativescript/core/utils",
+                    //   "@nativescript/core/ui/gestures",
+                    //   "@nativescript/core/ui/action-bar",
+                    //   "@nativescript/core/ui/dialogs",
+                    //   "@nativescript/core/ui/list-view",
+                    //   "@nativescript/core/ui/search-bar",
+                    //   "@nativescript/core/ui/tab-view",
+                    //   "@nativescript/core/ui/web-view",
+                    //   "@nativescript/core/ui/slider",
+                    //   "@nativescript/core/ui/switch",
+                    //   "@nativescript/core/ui/transition",
+                    //   "@nativescript/core/ui/date-picker",
+                    //   "@nativescript/core/ui/time-picker",
+                    //   "@nativescript/core/ui/image",
+                    //   "@nativescript/core/ui/image-cache",
+                    //   "@nativescript/core/ui/text-base",
+                    //   "@nativescript/core/ui/label",
+                    //   "@nativescript/core/ui/text-field",
+                    //   "@nativescript/core/ui/text-view",
+                    //   "@nativescript/core/text/span",
+                    //   "@nativescript/core/text/formatted-string",
+                    //   "@nativescript/core/ui/animation",
+                    //   "@nativescript/core/ui/layouts/layout-base",
+                    // ];
+                    // for (const m of __ns_android_modules) {
+                    //   imports += `import '${m}?ns-keep';\n`;
+                    // }
+                }
                 if (polyfillsExists) {
                     imports += `import '${polyfillsPath}';\n`;
                 }
-                // Import WebSocket support for HMR in development
-                if (debug && cliFlags.hmr) {
-                    imports += `import '${hmrClientPath}';\n`;
-                }
-                // Import inspector modules for debugging in development
-                if (debug) {
-                    imports += `import '@nativescript/core/inspector_modules';\n`;
-                }
                 // Import CSS and apply via Application.addCss before main entry
                 const appCssPath = path.resolve(projectRoot, "src/app.css");
                 if (fs.existsSync(appCssPath)) {
                     imports += `
-    // Import and apply global CSS
+    // Import and apply global CSS before Angular bootstrap
     import appCssContent from './src/app.css?inline';
     import { Application } from '@nativescript/core';
     
-    if (typeof global !== 'undefined' && appCssContent) {
+    if (appCssContent) {
       try {
-        // Just testing logs if needed
-        // console.log('🎨 CSS content length:', appCssContent.length);
-        // console.log('🎨 CSS content preview:', appCssContent.substring(0, 200) + '...');
-    
         Application.addCss(appCssContent);
         // console.log('🎨 Global CSS applied');
       } catch (error) {
         console.error('Error applying CSS:', error);
       }
-    }
-    `;
+    }`;
                 }
-                imports += `import '${mainEntry}';`;
+                // Import main entry to initialize after all platform setup above
+                imports += `import '${mainEntry}';\n`;
+                // Import WebSocket support for HMR in development
+                if (debug && cliFlags.hmr && hmrClientExists) {
+                    imports += `import '${hmrClientPath}';\n`;
+                }
+                // Import inspector modules for debugging in development
                 if (debug) {
-                    console.log("🔄 Virtual entry imports:", imports);
+                    imports += `import '@nativescript/core/inspector_modules';\n`;
                 }
+                // if (debug) {
+                //   console.log("🔄 Virtual entry imports:", imports);
+                // }
                 return imports;
             }
             return null;

package/dist/helpers/ns-cli-plugins.d.ts

@@ -12,8 +12,11 @@ export declare function hmrPlugin(targetMode: string): {
 };
 export declare function cliPlugin(targetMode: string, cliFlags: any): {
     name: string;
+    apply: string;
     enforce: "post";
     configResolved(config: any): void;
     buildStart(): void;
+    generateBundle(options: any, bundle: any): void;
+    writeBundle(options: any, bundle: any): void;
     closeBundle(): void;
 };

package/dist/helpers/ns-cli-plugins.js

@@ -1,5 +1,5 @@
 import path from "path";
-import { readdirSync, statSync } from "fs";
+import { readdirSync, statSync, existsSync, mkdirSync } from "fs";
 // NativeScript HMR integration - track changes for incremental builds
 // Track changed files globally for HMR
 let changedFilesTracker = new Set();
@@ -56,8 +56,13 @@ export function hmrPlugin(targetMode) {
 }
 // NativeScript CLI integration - including IPC communication for HMR
 export function cliPlugin(targetMode, cliFlags) {
+    // Capture emitted files directly from Rollup hooks to avoid relying on FS state
+    const lastBundleFiles = new Set();
+    let lastOutDir;
+    const debug = !!cliFlags?.viteDebug || !!process.env.DEBUG;
     return {
         name: "nativescript-cli-integration",
+        apply: "build",
         // Ensure we run after other plugins (like vite-plugin-static-copy)
         enforce: "post",
         // Resolve build outDir so we can read final outputs after all plugins finish
@@ -70,15 +75,69 @@ export function cliPlugin(targetMode, cliFlags) {
                 console.log("🔥 Vite: Build started");
             }
         },
+        // Use Rollup hook to record emitted file names (relative to output dir)
+        generateBundle(options, bundle) {
+            try {
+                const keys = Object.keys(bundle);
+                for (const k of keys)
+                    lastBundleFiles.add(k);
+                // Remember outDir/file from Rollup options if provided
+                lastOutDir =
+                    options.dir ||
+                        (options.file && path.dirname(options.file)) ||
+                        undefined;
+                if (debug) {
+                    console.log(`🔥 [cliPlugin] generateBundle: files=${keys.length}, dir=${lastOutDir ?? "(unknown)"}`);
+                    if (keys.length) {
+                        console.log("🔥 [cliPlugin] bundle keys:", keys);
+                    }
+                }
+            }
+            catch {
+                // noop
+            }
+        },
+        // Also tap writeBundle (called only when writing to disk)
+        writeBundle(options, bundle) {
+            try {
+                const keys = Object.keys(bundle);
+                for (const k of keys)
+                    lastBundleFiles.add(k);
+                lastOutDir =
+                    options.dir ||
+                        (options.file && path.dirname(options.file)) ||
+                        lastOutDir;
+                if (debug) {
+                    console.log(`🔥 [cliPlugin] writeBundle: files=${keys.length}, dir=${lastOutDir ?? "(unknown)"}`);
+                }
+            }
+            catch {
+                // noop
+            }
+        },
         // Defer CLI notification until after all plugins (including static copy) are done.
         closeBundle() {
             if (targetMode !== "development")
                 return;
             const buildType = isInitialBuild ? "initial" : "incremental";
             console.log(`🔥 NativeScript: ${buildType} build completed`);
-            // After static copy has finished, read actual dist contents
-            const distDir = getOutDir();
-            const emittedFiles = listFilesFlat(distDir);
+            // Determine outDir and ensure it exists in dev for a clean start
+            const distDir = lastOutDir || getOutDir();
+            if (!existsSync(distDir)) {
+                try {
+                    mkdirSync(distDir, { recursive: true });
+                }
+                catch {
+                    // ignore; listing will just return []
+                }
+            }
+            // Prefer Rollup-reported bundle files; fall back to FS scan
+            const emittedFiles = lastBundleFiles.size
+                ? Array.from(lastBundleFiles)
+                : listFilesFlat(distDir);
+            if (debug) {
+                console.log(`🔥 [cliPlugin] closeBundle: distDir=${distDir}, captured=${lastBundleFiles.size}, fsScan=${emittedFiles.length}`);
+            }
             // Determine what changed
             const changedFilesList = Array.from(changedFilesTracker);
             const hasHTMLChanges = changedFilesList.some((f) => f.endsWith(".html"));
@@ -103,26 +162,43 @@ export function cliPlugin(targetMode, cliFlags) {
             }
             console.log(`🔥 Emitted ${emittedFiles.length} files in ${buildType} build`);
             if (process.send) {
-                const message = {
-                    emittedFiles,
-                    chunkFiles: emittedFiles.filter((f) => f.includes("chunk") || f.includes("vendor")),
-                    hash: Date.now().toString(),
-                    isHMR: isHMR && !isInitialBuild,
-                    changedFiles: changedFilesList,
-                    buildType,
-                    timestamp: Date.now(),
+                const sendMessage = (files) => {
+                    const message = {
+                        emittedFiles: files,
+                        chunkFiles: files.filter((f) => f.includes("chunk") || f.includes("vendor")),
+                        hash: Date.now().toString(),
+                        isHMR: isHMR && !isInitialBuild,
+                        changedFiles: changedFilesList,
+                        buildType,
+                        timestamp: Date.now(),
+                    };
+                    console.log(`🔥 Sending ${buildType} build notification to CLI (isHMR: ${message.isHMR})`);
+                    if (changedFilesList.length > 0) {
+                        console.log("🔥 IPC includes changed files:", changedFilesList);
+                    }
+                    process.send(message);
                 };
-                console.log(`🔥 Sending ${buildType} build notification to CLI (isHMR: ${message.isHMR})`);
-                if (changedFilesList.length > 0) {
-                    console.log("🔥 IPC includes changed files:", changedFilesList);
+                if (emittedFiles.length === 0) {
+                    // Allow a short delay for any late FS writes by other post plugins
+                    setTimeout(() => {
+                        const rescanned = listFilesFlat(distDir);
+                        if (debug) {
+                            console.log(`🔥 [cliPlugin] delayed rescan found ${rescanned.length} files in ${distDir}`);
+                        }
+                        sendMessage(rescanned);
+                    }, 50);
+                }
+                else {
+                    sendMessage(emittedFiles);
                 }
-                process.send(message);
             }
             if (isInitialBuild) {
                 isInitialBuild = false;
                 console.log("🔥 Initial build complete - subsequent changes will trigger fast rebuilds");
             }
             changedFilesTracker.clear();
+            lastBundleFiles.clear();
+            lastOutDir = undefined;
         },
     };
 }

package/dist/helpers/preserve-imports.d.ts

@@ -0,0 +1,2 @@
+import type { Plugin } from 'vite';
+export declare function preserveImportsPlugin(): Plugin;

package/dist/helpers/preserve-imports.js

@@ -0,0 +1,19 @@
+// Marks modules imported with `?ns-keep` as side-effectful so Rollup won't tree-shake them.
+export function preserveImportsPlugin() {
+    return {
+        name: 'ns-preserve-imports',
+        // run early so downstream plugins see the preserved flag
+        enforce: 'pre',
+        async transform(code, id) {
+            if (id.includes('?ns-keep')) {
+                return {
+                    code,
+                    map: null,
+                    // ensure side effects are preserved even if bindings are unused
+                    moduleSideEffects: true,
+                };
+            }
+            return null;
+        },
+    };
+}

package/dist/helpers/side-effects.d.ts

@@ -0,0 +1,14 @@
+export declare function nsCoreAllVirtual(): {
+    name: string;
+    buildStart(): void;
+    resolveId(id: string): string;
+    load(id: string): string;
+};
+export declare function noTreeshakeNSCore(): {
+    name: string;
+    resolveId(source: string, importer: string | undefined, opts: any): Promise<any>;
+    transform(code: string, id: string): {
+        code: string;
+        moduleSideEffects: true;
+    };
+};

package/dist/helpers/side-effects.js

@@ -0,0 +1,69 @@
+import fs from 'node:fs';
+import path from 'node:path';
+import { createRequire } from 'node:module';
+const NS_RE = /node_modules[\\/]\@nativescript[\\/]core[\\/]/;
+export function nsCoreAllVirtual() {
+    const VIRT_ID = 'virtual:ns-core-all';
+    const RESOLVED = '\0' + VIRT_ID;
+    let code = '';
+    function walk(dir, out = []) {
+        for (const entry of fs.readdirSync(dir, { withFileTypes: true })) {
+            const abs = path.join(dir, entry.name);
+            if (entry.isDirectory()) {
+                // skip obviously irrelevant dirs if present
+                if (entry.name === 'types' || entry.name === '__tests__')
+                    continue;
+                walk(abs, out);
+            }
+            else if (/\.(m?js|cjs)$/.test(entry.name)) {
+                out.push(abs);
+            }
+        }
+        return out;
+    }
+    return {
+        name: 'ns-core-all-virtual',
+        buildStart() {
+            // ESM-safe resolve for node_modules
+            const require = createRequire(import.meta.url);
+            const pkgPath = require.resolve('@nativescript/core/package.json');
+            const root = path.dirname(pkgPath);
+            const files = walk(root);
+            code = files
+                .map((abs) => {
+                const rel = path.relative(root, abs).split(path.sep).join('/');
+                return `import '@nativescript/core/${rel}';`;
+            })
+                .join('\n');
+            this.warn(`[ns-core-all-virtual] including ${files.length} files from @nativescript/core`);
+        },
+        resolveId(id) {
+            if (id === VIRT_ID)
+                return RESOLVED;
+        },
+        load(id) {
+            if (id === RESOLVED)
+                return code;
+        }
+    };
+}
+export function noTreeshakeNSCore() {
+    return {
+        name: 'ns-core-no-treeshake',
+        async resolveId(source, importer, opts) {
+            const r = await this.resolve(source, importer, { skipSelf: true, ...opts });
+            if (!r)
+                return null;
+            if (NS_RE.test(r.id)) {
+                // Strongest signal to Rollup: do not treeshake this module
+                return { ...r, moduleSideEffects: true };
+            }
+            return r;
+        },
+        transform(code, id) {
+            if (NS_RE.test(id))
+                return { code, moduleSideEffects: true };
+            return null;
+        }
+    };
+}

package/dist/helpers/ts-config-paths.js

@@ -134,7 +134,9 @@ function createTsConfigAliases(paths, baseUrl, platform, debugViteLogs) {
                 const resolvedDestination = path.isAbsolute(destination)
                     ? destination
                     : path.resolve(projectRoot, baseUrl, destination);
-                console.log(`📁 Creating wildcard alias: ${aliasKey} -> ${resolvedDestination}`);
+                // console.log(
+                //   `📁 Creating wildcard alias: ${aliasKey} -> ${resolvedDestination}`,
+                // );
                 aliases.push({
                     find: new RegExp(`^${aliasKey.replace(/[.*+?^${}()|[\]\\]/g, "\\$&")}(?:/(.*))?$`),
                     replacement: (match, subpath) => {

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@nativescript/vite",
-    "version": "0.0.1-alpha.0",
+    "version": "0.0.1-alpha.1",
     "description": "Vite for NativeScript",
     "main": "./dist/index.js",
     "module": "./dist/index.js",