@thelacanians/vue-native-vite-plugin 0.1.0

package/dist/index.cjs

@@ -0,0 +1,85 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var index_exports = {};
+__export(index_exports, {
+  default: () => vueNativePlugin
+});
+module.exports = __toCommonJS(index_exports);
+function vueNativePlugin(options = {}) {
+  const { platform = "ios", globalName = "VueNativeApp" } = options;
+  return {
+    name: "vue-native",
+    /**
+     * Modify Vite's resolved config to set up aliases, defines, and build
+     * settings appropriate for a native iOS or Android target.
+     */
+    config(config, env) {
+      const isDev = env.mode !== "production";
+      return {
+        resolve: {
+          alias: {
+            // Redirect all 'vue' imports to the native runtime.
+            // This means when @vitejs/plugin-vue compiles SFCs and they
+            // import from 'vue', they actually get '@thelacanians/vue-native-runtime'
+            // which uses the native renderer instead of the DOM renderer.
+            vue: "@thelacanians/vue-native-runtime"
+          }
+        },
+        define: {
+          // Compile-time flag for development-only code paths
+          __DEV__: JSON.stringify(isDev),
+          // Platform identifier available at compile time
+          __PLATFORM__: JSON.stringify(platform),
+          // Replace process.env.NODE_ENV references from @vue/shared and
+          // @vue/runtime-core. JavaScriptCore has no `process` global, so
+          // leaving these unresolved would crash the bundle on load.
+          "process.env.NODE_ENV": JSON.stringify(isDev ? "development" : "production")
+        },
+        build: {
+          // Target ES2020 for modern JavaScript engine compatibility
+          // (JavaScriptCore on iOS and V8/J2V8 on Android both support ES2020+)
+          target: "es2020",
+          // IIFE output for embedding in native app
+          lib: {
+            entry: config.build?.lib?.entry || "app/main.ts",
+            formats: ["iife"],
+            name: globalName,
+            fileName: () => "vue-native-bundle.js"
+          },
+          rollupOptions: {
+            output: {
+              // Ensure everything is inlined into a single file
+              inlineDynamicImports: true,
+              // Disable code splitting — we need a single bundle file
+              manualChunks: void 0
+            }
+          },
+          // Don't clear the output directory (native project may have other files)
+          emptyOutDir: false,
+          // Generate source maps for debugging in native dev tools
+          sourcemap: isDev,
+          // Minify in production
+          minify: isDev ? false : "esbuild"
+        }
+      };
+    }
+  };
+}

package/dist/index.d.cts

@@ -0,0 +1,88 @@
+/**
+ * @thelacanians/vue-native-vite-plugin — Vite plugin for building Vue Native applications.
+ *
+ * This plugin is used ALONGSIDE @vitejs/plugin-vue (not as a replacement).
+ * It configures Vite to:
+ * - Alias 'vue' imports to '@thelacanians/vue-native-runtime' so that Vue SFCs use the
+ *   native renderer instead of the DOM renderer
+ * - Define __DEV__ and __PLATFORM__ compile-time constants
+ * - Configure the build for IIFE output suitable for embedding in a native
+ *   app's JavaScript runtime (JavaScriptCore on iOS, V8/J2V8 on Android)
+ *
+ * @example
+ * ```ts
+ * // vite.config.ts
+ * import vue from '@vitejs/plugin-vue'
+ * import vueNative from '@thelacanians/vue-native-vite-plugin'
+ *
+ * export default defineConfig({
+ *   plugins: [vue(), vueNative()],
+ * })
+ * ```
+ */
+interface VueNativePluginOptions {
+    /**
+     * Target platform.
+     * - `'ios'` — JavaScriptCore (built into iOS)
+     * - `'android'` — V8 via J2V8
+     * @default 'ios'
+     */
+    platform?: 'ios' | 'android';
+    /**
+     * The global variable name for the IIFE bundle.
+     * @default 'VueNativeApp'
+     */
+    globalName?: string;
+    /**
+     * Enable hot reload WebSocket server integration.
+     * When true, configures the build for watch mode output.
+     * @default true
+     */
+    hotReload?: boolean;
+    /**
+     * Port for the hot reload WebSocket server (started by `vue-native dev`).
+     * @default 8174
+     */
+    hotReloadPort?: number;
+}
+declare function vueNativePlugin(options?: VueNativePluginOptions): {
+    name: string;
+    /**
+     * Modify Vite's resolved config to set up aliases, defines, and build
+     * settings appropriate for a native iOS or Android target.
+     */
+    config(config: any, env: {
+        mode: string;
+    }): {
+        resolve: {
+            alias: {
+                vue: string;
+            };
+        };
+        define: {
+            __DEV__: string;
+            __PLATFORM__: string;
+            'process.env.NODE_ENV': string;
+        };
+        build: {
+            target: string;
+            lib: {
+                entry: any;
+                formats: any;
+                name: string;
+                fileName: () => string;
+            };
+            rollupOptions: {
+                output: {
+                    inlineDynamicImports: boolean;
+                    manualChunks: undefined;
+                };
+            };
+            emptyOutDir: boolean;
+            sourcemap: boolean;
+            minify: string | boolean;
+        };
+    };
+};
+
+export { type VueNativePluginOptions, vueNativePlugin as default };

package/dist/index.d.ts

@@ -0,0 +1,88 @@
+/**
+ * @thelacanians/vue-native-vite-plugin — Vite plugin for building Vue Native applications.
+ *
+ * This plugin is used ALONGSIDE @vitejs/plugin-vue (not as a replacement).
+ * It configures Vite to:
+ * - Alias 'vue' imports to '@thelacanians/vue-native-runtime' so that Vue SFCs use the
+ *   native renderer instead of the DOM renderer
+ * - Define __DEV__ and __PLATFORM__ compile-time constants
+ * - Configure the build for IIFE output suitable for embedding in a native
+ *   app's JavaScript runtime (JavaScriptCore on iOS, V8/J2V8 on Android)
+ *
+ * @example
+ * ```ts
+ * // vite.config.ts
+ * import vue from '@vitejs/plugin-vue'
+ * import vueNative from '@thelacanians/vue-native-vite-plugin'
+ *
+ * export default defineConfig({
+ *   plugins: [vue(), vueNative()],
+ * })
+ * ```
+ */
+interface VueNativePluginOptions {
+    /**
+     * Target platform.
+     * - `'ios'` — JavaScriptCore (built into iOS)
+     * - `'android'` — V8 via J2V8
+     * @default 'ios'
+     */
+    platform?: 'ios' | 'android';
+    /**
+     * The global variable name for the IIFE bundle.
+     * @default 'VueNativeApp'
+     */
+    globalName?: string;
+    /**
+     * Enable hot reload WebSocket server integration.
+     * When true, configures the build for watch mode output.
+     * @default true
+     */
+    hotReload?: boolean;
+    /**
+     * Port for the hot reload WebSocket server (started by `vue-native dev`).
+     * @default 8174
+     */
+    hotReloadPort?: number;
+}
+declare function vueNativePlugin(options?: VueNativePluginOptions): {
+    name: string;
+    /**
+     * Modify Vite's resolved config to set up aliases, defines, and build
+     * settings appropriate for a native iOS or Android target.
+     */
+    config(config: any, env: {
+        mode: string;
+    }): {
+        resolve: {
+            alias: {
+                vue: string;
+            };
+        };
+        define: {
+            __DEV__: string;
+            __PLATFORM__: string;
+            'process.env.NODE_ENV': string;
+        };
+        build: {
+            target: string;
+            lib: {
+                entry: any;
+                formats: any;
+                name: string;
+                fileName: () => string;
+            };
+            rollupOptions: {
+                output: {
+                    inlineDynamicImports: boolean;
+                    manualChunks: undefined;
+                };
+            };
+            emptyOutDir: boolean;
+            sourcemap: boolean;
+            minify: string | boolean;
+        };
+    };
+};
+
+export { type VueNativePluginOptions, vueNativePlugin as default };

package/dist/index.js

@@ -0,0 +1,64 @@
+// src/index.ts
+function vueNativePlugin(options = {}) {
+  const { platform = "ios", globalName = "VueNativeApp" } = options;
+  return {
+    name: "vue-native",
+    /**
+     * Modify Vite's resolved config to set up aliases, defines, and build
+     * settings appropriate for a native iOS or Android target.
+     */
+    config(config, env) {
+      const isDev = env.mode !== "production";
+      return {
+        resolve: {
+          alias: {
+            // Redirect all 'vue' imports to the native runtime.
+            // This means when @vitejs/plugin-vue compiles SFCs and they
+            // import from 'vue', they actually get '@thelacanians/vue-native-runtime'
+            // which uses the native renderer instead of the DOM renderer.
+            vue: "@thelacanians/vue-native-runtime"
+          }
+        },
+        define: {
+          // Compile-time flag for development-only code paths
+          __DEV__: JSON.stringify(isDev),
+          // Platform identifier available at compile time
+          __PLATFORM__: JSON.stringify(platform),
+          // Replace process.env.NODE_ENV references from @vue/shared and
+          // @vue/runtime-core. JavaScriptCore has no `process` global, so
+          // leaving these unresolved would crash the bundle on load.
+          "process.env.NODE_ENV": JSON.stringify(isDev ? "development" : "production")
+        },
+        build: {
+          // Target ES2020 for modern JavaScript engine compatibility
+          // (JavaScriptCore on iOS and V8/J2V8 on Android both support ES2020+)
+          target: "es2020",
+          // IIFE output for embedding in native app
+          lib: {
+            entry: config.build?.lib?.entry || "app/main.ts",
+            formats: ["iife"],
+            name: globalName,
+            fileName: () => "vue-native-bundle.js"
+          },
+          rollupOptions: {
+            output: {
+              // Ensure everything is inlined into a single file
+              inlineDynamicImports: true,
+              // Disable code splitting — we need a single bundle file
+              manualChunks: void 0
+            }
+          },
+          // Don't clear the output directory (native project may have other files)
+          emptyOutDir: false,
+          // Generate source maps for debugging in native dev tools
+          sourcemap: isDev,
+          // Minify in production
+          minify: isDev ? false : "esbuild"
+        }
+      };
+    }
+  };
+}
+export {
+  vueNativePlugin as default
+};

package/package.json

@@ -0,0 +1,41 @@
+{
+  "name": "@thelacanians/vue-native-vite-plugin",
+  "version": "0.1.0",
+  "description": "Vite plugin for Vue Native — builds IIFE bundles for native runtimes",
+  "license": "MIT",
+  "author": "Vue Native Contributors",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/abdul-hamid-achik/vue-native",
+    "directory": "packages/vite-plugin"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "type": "module",
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "require": "./dist/index.cjs"
+    }
+  },
+  "files": ["dist"],
+  "scripts": {
+    "build": "tsup src/index.ts --format esm,cjs --dts",
+    "dev": "tsup src/index.ts --format esm,cjs --dts --watch",
+    "clean": "rm -rf dist"
+  },
+  "peerDependencies": {
+    "vite": "^6.0.0",
+    "@vitejs/plugin-vue": "^5.0.0"
+  },
+  "devDependencies": {
+    "tsup": "^8.4.0",
+    "typescript": "^5.7.0",
+    "vite": "^6.1.0"
+  }
+}