@nativescript/cloudflare-cli 0.1.0-beta.7 → 0.1.0-beta.9

package/README.md

@@ -1,24 +1,25 @@
-# @nativescript/cloudflare-cli
-
-```sh
-npx @nativescript/cloudflare-cli live          # a phone app: opens the IDE and prints a QR code for NativeScript Preview
-npx @nativescript/cloudflare-cli live --mac    # a Mac app: opens the IDE and runs the app on this Mac, streamed into the IDE
-npx @nativescript/cloudflare-cli live --electron   # an Electron app with native views, run the same way
-```
-
-`live` creates a project on preview.nativescript.org (`--server` or `NS_EDGE_SERVER` for another edge), saves it to `.ns-edge.json` and opens its IDE. Run it again in the same folder to reopen that project (no platform flag needed), or add `--new` for another. While `live` runs a Mac app it restarts the app if it crashes, unless it crashes three times in a minute. Without a create token the project is free: a few hosted agent turns a day, no backend, deleted after 30 days unused. `--no-open` skips the browser; with `--mac` or `--electron`, `--allow-eval` lets the agent run code on this Mac.
-
-## Mirror a local project
-
-Mirror a NativeScript project into an ns-edge project from a terminal or a Vite dev server.
-
-```sh
-npm i -D @nativescript/cloudflare-cli@beta
-npx ns-edge create --server https://preview.nativescript.org --token <create token>   # --template vue for nativescript-vue
-npx ns-edge watch        # push, then every save
-npx ns-edge qr           # print the pairing QR code again
-```
-
-Also: `ns-edge push` uploads `app/` and `server/` once, `ns-edge pull` downloads the project's files.
-
-`ns-edge create` writes `.ns-edge.json` (project id and keys; keep it out of git). In a Vite config, `@nativescript/cloudflare-cli/vite` mirrors `app/` and `server/` on every save.
+# @nativescript/cloudflare-cli
+
+```sh
+npx @nativescript/cloudflare-cli live          # a phone app: opens the IDE and prints a QR code for NativeScript Preview
+npx @nativescript/cloudflare-cli live --react  # the same with a framework: --ng (Angular), --react, --vue, --svelte or --solid
+npx @nativescript/cloudflare-cli live --mac    # a Mac app: opens the IDE and runs the app on this Mac, streamed into the IDE
+npx @nativescript/cloudflare-cli live --electron   # an Electron app with native views, run the same way
+```
+
+`live` creates a project on preview.nativescript.org (`--server` or `NS_EDGE_SERVER` for another edge), saves it to `.ns-edge.json` and opens its IDE. The framework flags are `ns create`'s (`--ng`/`--angular`, `--react`, `--vue`, `--svelte`, `--solid`, `--ts`); without one a phone project is plain TypeScript with XML views. Run it again in the same folder to reopen that project (no flag needed), or add `--new` for another; a flag for a different kind of project than the folder's asks for `--new`. While `live` runs a Mac app it restarts the app if it crashes, unless it crashes three times in a minute. Without a create token the project is free: a few hosted agent turns a day, no backend, deleted after 30 days unused. `--no-open` skips the browser; with `--mac` or `--electron`, `--allow-eval` lets the agent run code on this Mac.
+
+## Mirror a local project
+
+Mirror a NativeScript project into an ns-edge project from a terminal or a Vite dev server.
+
+```sh
+npm i -D @nativescript/cloudflare-cli@beta
+npx ns-edge create --server https://preview.nativescript.org --token <create token>   # --template vue for nativescript-vue
+npx ns-edge watch        # push, then every save
+npx ns-edge qr           # print the pairing QR code again
+```
+
+Also: `ns-edge push` uploads `app/` and `server/` once, `ns-edge pull` downloads the project's files.
+
+`ns-edge create` writes `.ns-edge.json` (project id and keys; keep it out of git). In a Vite config, `@nativescript/cloudflare-cli/vite` mirrors `app/` and `server/` on every save.

package/dist/bin.js

@@ -2,21 +2,42 @@
 import { spawn } from 'node:child_process';
 import { existsSync, watch } from 'node:fs';
 import { readFile, writeFile } from 'node:fs/promises';
-import { join, sep } from 'node:path';
+import { dirname, join, sep } from 'node:path';
 import { createInterface } from 'node:readline/promises';
 import QRCode from 'qrcode';
 import { applyChanges, collect, createProject, projectUrl, report, SYNCED } from './sync.js';
 const CONFIG = '.ns-edge.json';
 const DEBOUNCE_MS = 120;
 const LIVE_SERVER = process.env.NS_EDGE_SERVER ?? 'https://preview.nativescript.org';
-/** The hosts `live --mac`, `--electron` and `--expo` run; bump them with each host release this CLI is tested against. */
+/** The hosts `live --desktop` (or `--mac`, `--windows`), `--electron` and `--expo` run; bump them with each host release this CLI is tested against. */
 const DESKTOP_HOSTS = {
-    macos: { spec: '@nativescript/cloudflare-desktop@0.1.0-alpha.5', bin: 'ns-edge-desktop' },
-    electron: { spec: '@nativescript/cloudflare-electron@0.1.0-alpha.2', bin: 'ns-edge-electron' },
-    expo: { spec: '@nativescript/cloudflare-expo-desktop@0.1.0-alpha.0', bin: 'ns-edge-expo-desktop' },
+    macos: { spec: '@nativescript/cloudflare-desktop@0.1.0-alpha.6', bin: 'ns-edge-desktop' },
+    electron: { spec: '@nativescript/cloudflare-electron@0.1.0-alpha.3', bin: 'ns-edge-electron' },
+    expo: { spec: '@nativescript/cloudflare-expo-desktop@0.1.0-alpha.1', bin: 'ns-edge-expo-desktop' },
 };
 const DESKTOP_TEMPLATES = new Set(['macos', 'electron', 'expo']);
-const DESKTOP_FLAGS = { macos: 'mac', electron: 'electron', expo: 'expo' };
+/** The macos template is the desktop one: it runs on a Mac with AppKit and on Windows with WinUI, so all three flags pick it. */
+const DESKTOP_FLAGS = { macos: ['desktop', 'mac', 'windows'], electron: ['electron'], expo: ['expo'] };
+/** The NativeScript CLI's `ns create` framework flags, so `live` and `create` take the same ones. */
+const FRAMEWORK_FLAGS = {
+    angular: ['ng', 'angular'],
+    react: ['react', 'reactjs'],
+    vue: ['vue', 'vuejs'],
+    svelte: ['svelte'],
+    solid: ['solid', 'solidjs'],
+    core: ['ts', 'tsc', 'typescript'],
+};
+const TEMPLATE_KINDS = {
+    core: 'a phone',
+    angular: 'an Angular phone',
+    react: 'a React phone',
+    vue: 'a Vue phone',
+    svelte: 'a Svelte phone',
+    solid: 'a Solid phone',
+    macos: 'a desktop',
+    electron: 'an Electron',
+    expo: 'an Expo Desktop',
+};
 const MAX_CRASHES = 3;
 const CRASH_WINDOW_MS = 60_000;
 const RESTART_DELAY_MS = 1000;
@@ -32,6 +53,22 @@ const flag = (name) => {
     return i >= 0 ? args[i + 1] : undefined;
 };
 const has = (name) => args.includes(`--${name}`);
+/** The template --template, a framework flag or a desktop flag asks for, if any; asking for two is an error. */
+function requestedTemplate() {
+    const asked = new Set();
+    const named = flag('template');
+    if (named)
+        asked.add(named);
+    for (const [template, names] of Object.entries(FRAMEWORK_FLAGS))
+        if (names.some((name) => has(name)))
+            asked.add(template);
+    for (const [template, names] of Object.entries(DESKTOP_FLAGS))
+        if (names.some((name) => has(name)))
+            asked.add(template);
+    if (asked.size > 1)
+        throw new Error(`Pick one kind of project: this asked for ${[...asked].join(' and ')}.`);
+    return [...asked][0];
+}
 const root = process.cwd();
 async function loadRef() {
     let ref;
@@ -80,14 +117,31 @@ function openInBrowser(url) {
     const [command, ...rest] = process.platform === 'darwin' ? ['open', url] : process.platform === 'win32' ? ['cmd', '/c', 'start', '""', url.replace(/&/g, '^&')] : ['xdg-open', url];
     spawn(command, rest, { stdio: 'ignore', detached: true }).on('error', () => { }).unref();
 }
+const COMPUTER = process.platform === 'win32' ? 'PC' : 'Mac';
+/**
+ * How to run npx. On Windows it's npx.cmd, which Node won't spawn without a
+ * shell (and a shell would re-parse the arguments), so npm's own npx-cli.js
+ * runs with this Node instead when it's where Node's installer puts it.
+ */
+function npx() {
+    if (process.platform !== 'win32')
+        return ['npx'];
+    const cli = join(dirname(process.execPath), 'node_modules', 'npm', 'bin', 'npx-cli.js');
+    return existsSync(cli) ? [process.execPath, cli] : ['npx.cmd'];
+}
 /**
- * Runs the Mac host for a desktop project until it quits or Ctrl+C. A host that
- * crashes is started again, since nothing in the browser can reach this Mac to
- * do it, unless it keeps crashing. The host says what joining allows.
+ * Runs the desktop host for a desktop project until it quits or Ctrl+C. A host
+ * that crashes is started again, since nothing in the browser can reach this
+ * computer to do it, unless it keeps crashing. The host says what joining allows.
  */
 async function runDesktopHost(ref) {
-    if (process.platform !== 'darwin' || process.arch !== 'arm64') {
-        throw new Error('Mac projects run on an Apple Silicon Mac (macOS 14.4 or later). Run the same command there.');
+    const mac = process.platform === 'darwin' && process.arch === 'arm64';
+    const windows = process.platform === 'win32' && (process.arch === 'x64' || process.arch === 'arm64');
+    if (ref.template === 'expo' && !mac && !(windows && process.arch === 'x64')) {
+        throw new Error('Expo Desktop projects run on an Apple Silicon Mac (macOS 14.4 or later) or a Windows x64 PC. Run the same command on one.');
+    }
+    if (!mac && !windows) {
+        throw new Error('Desktop projects run on an Apple Silicon Mac (macOS 14.4 or later) or a Windows 10 (1903 or later) or Windows 11 PC. Run the same command there.');
     }
     const device = `${projectUrl(ref)}#${ref.deviceKey}`;
     const extra = has('allow-eval') ? ['--allow-eval'] : [];
@@ -104,7 +158,8 @@ async function runDesktopHost(ref) {
     }
     const crashes = [];
     for (;;) {
-        child = spawn('npx', ['-y', '--package', spec, '--', host.bin, device, '--yes', ...extra], { stdio: 'inherit' });
+        const [command, ...prefix] = npx();
+        child = spawn(command, [...prefix, '-y', '--package', spec, '--', host.bin, device, '--yes', ...extra], { stdio: 'inherit' });
         const exit = await new Promise((resolve, reject) => {
             child.on('error', reject);
             child.on('exit', (code, signal) => resolve({ code, signal }));
@@ -117,9 +172,9 @@ async function runDesktopHost(ref) {
             crashes.shift();
         const why = exit.signal ?? `code ${exit.code}`;
         if (crashes.length > MAX_CRASHES) {
-            throw new Error(`The Mac host crashed ${crashes.length} times in a minute (last: ${why}), so it wasn't restarted. Fix the error above, then run this command again.`);
+            throw new Error(`The desktop host crashed ${crashes.length} times in a minute (last: ${why}), so it wasn't restarted. Fix the error above, then run this command again.`);
         }
-        console.log(`\nThe Mac host stopped (${why}). Starting it again…\n`);
+        console.log(`\nThe desktop host stopped (${why}). Starting it again…\n`);
         await new Promise((r) => setTimeout(r, RESTART_DELAY_MS));
     }
 }
@@ -127,17 +182,16 @@ const commands = {
     async live() {
         for (const later of ['ios', 'android', 'all']) {
             if (has(later))
-                throw new Error(`--${later} isn't available yet. Run \`live\` for a phone app, or \`live --mac\`, \`--electron\` or \`--expo\` for a Mac app.`);
+                throw new Error(`--${later} isn't available yet. Run \`live\` for a phone app, or \`live --desktop\`, \`--electron\` or \`--expo\` for a desktop app.`);
         }
         let ref = has('new') ? null : await savedProject();
-        // Without a platform flag, this folder's project runs as whatever it was made as.
-        const template = flag('template') ?? Object.entries(DESKTOP_FLAGS).find(([, name]) => has(name))?.[0] ?? ref?.template ?? 'core';
+        const requested = requestedTemplate();
+        // Without a template flag, this folder's project runs as whatever it was made as.
+        const template = requested ?? ref?.template ?? 'core';
         const desktop = DESKTOP_TEMPLATES.has(template);
-        if (ref && DESKTOP_TEMPLATES.has(ref.template ?? 'core') !== desktop) {
-            throw new Error(`This folder's project (${CONFIG}) is a ${desktop ? 'phone' : 'Mac'} project. Add --new to replace it, or run this in another folder.`);
-        }
-        if (ref && desktop && ref.template !== template) {
-            throw new Error(`This folder's project (${CONFIG}) is a ${ref.template} project. Add --new to replace it, or run this in another folder.`);
+        if (ref && requested && (ref.template ?? 'core') !== requested) {
+            const current = TEMPLATE_KINDS[ref.template ?? 'core'] ?? `a ${ref.template}`;
+            throw new Error(`This folder's project (${CONFIG}) is ${current} project. Add --new to start ${TEMPLATE_KINDS[requested] ?? `a ${requested}`} one, or run this in another folder.`);
         }
         if (ref) {
             console.log(`Opening this folder's project ${ref.id} (${CONFIG})`);
@@ -145,8 +199,7 @@ const commands = {
         else {
             ref = await createProject(flag('server') ?? LIVE_SERVER, flag('token') ?? process.env.NS_EDGE_CREATE_TOKEN, template);
             await writeFile(join(root, CONFIG), JSON.stringify(ref, null, 2) + '\n');
-            const kind = template === 'electron' ? 'an Electron' : template === 'expo' ? 'an Expo Desktop' : desktop ? 'a Mac' : 'a phone';
-            console.log(`Created ${kind} project, saved to ${CONFIG} (it holds the project's keys: keep it private and out of git).`);
+            console.log(`Created ${TEMPLATE_KINDS[template] ?? `a ${template}`} project, saved to ${CONFIG} (it holds the project's keys: keep it private and out of git).`);
             if (ref.free) {
                 console.log(`It's a free project: ${ref.free.agentTurnsPerDay} hosted agent turn${ref.free.agentTurnsPerDay === 1 ? '' : 's'} a day, deleted after ${ref.free.idleDays} days unused. ` +
                     'For an unlimited agent, add your own API key in the agent panel or connect Claude Code from Connect agent.');
@@ -158,7 +211,7 @@ const commands = {
             openInBrowser(ide);
         if (desktop) {
             const first = template === 'electron' ? ' (the first run downloads Electron)' : template === 'expo' ? ' (the first run downloads the Expo Desktop shell)' : '';
-            console.log(`Starting the app on this Mac${first}. Its window streams to the IDE's Device pane. Press Ctrl+C to stop.\n`);
+            console.log(`Starting the app on this ${COMPUTER}${first}. Its window streams to the IDE's Device pane. Press Ctrl+C to stop.\n`);
             return runDesktopHost(ref);
         }
         const device = `${projectUrl(ref)}#${ref.deviceKey}`;
@@ -168,7 +221,7 @@ const commands = {
     },
     async create() {
         const server = flag('server') ?? 'http://localhost:5173';
-        const ref = await createProject(server, flag('token') ?? process.env.NS_EDGE_CREATE_TOKEN, flag('template'));
+        const ref = await createProject(server, flag('token') ?? process.env.NS_EDGE_CREATE_TOKEN, requestedTemplate());
         await writeFile(join(root, CONFIG), JSON.stringify(ref, null, 2) + '\n');
         console.log(`Created project ${ref.id} (saved to ${CONFIG}; it holds the project keys, keep it out of git)`);
         await printPairing(ref);
@@ -236,16 +289,19 @@ const commands = {
         await printPairing(await loadRef());
     },
     async help() {
-        console.log(`ns-edge <command>
-
-  live [--mac|--electron|--expo] [--new] [--no-open] [--allow-eval]
-                            create a project (or reopen this folder's), open its IDE, and print a QR code
-                            for your phone; --mac, --electron or --expo runs it on this Mac instead
-  create [--server <url>] [--token <t>] [--template core|vue|react|solid|svelte|angular]
-                            create an edge project and save .ns-edge.json
-  push                      upload app/ and server/ in one transaction
-  watch                     push, then stream every save to the edge
-  pull                      download the project's files here
+        console.log(`ns-edge <command>
+
+  live [--ng|--react|--vue|--svelte|--solid|--desktop|--electron|--expo] [--new] [--no-open] [--allow-eval]
+                            create a project (or reopen this folder's), open its IDE, and print a QR code
+                            for your phone; --ng, --react, --vue, --svelte or --solid picks the framework
+                            (plain TypeScript with XML views otherwise); --desktop (or --mac, --windows)
+                            or --electron runs it on this Mac or Windows PC instead, with that OS's own
+                            controls; --expo runs an Expo Desktop app on this Mac or Windows x64 PC
+  create [--server <url>] [--token <t>] [--ng|--react|--vue|--svelte|--solid|--template <name>]
+                            create an edge project and save .ns-edge.json
+  push                      upload app/ and server/ in one transaction
+  watch                     push, then stream every save to the edge
+  pull                      download the project's files here
   qr                        print the pairing QR code`);
     },
 };

package/package.json

@@ -1,43 +1,43 @@
-{
-  "name": "@nativescript/cloudflare-cli",
-  "version": "0.1.0-beta.7",
-  "description": "Mirror a NativeScript project into an ns-edge project from a terminal or a Vite dev server",
-  "license": "Apache-2.0",
-  "type": "module",
-  "bin": {
-    "ns-edge": "./dist/bin.js"
-  },
-  "exports": {
-    ".": "./dist/sync.js",
-    "./vite": "./dist/vite.js"
-  },
-  "scripts": {
-    "build": "tsc -p .",
-    "typecheck": "tsc -p . --noEmit",
-    "prepack": "npm run build"
-  },
-  "dependencies": {
-    "qrcode": "^1.5.4"
-  },
-  "devDependencies": {
-    "@types/node": "^24.0.0",
-    "@types/qrcode": "^1.5.6",
-    "typescript": "^6.0.0",
-    "vite": "^8.3.5"
-  },
-  "peerDependencies": {
-    "vite": ">=6"
-  },
-  "peerDependenciesMeta": {
-    "vite": {
-      "optional": true
-    }
-  },
-  "files": [
-    "dist"
-  ],
-  "publishConfig": {
-    "access": "public",
-    "tag": "beta"
-  }
-}
+{
+  "name": "@nativescript/cloudflare-cli",
+  "version": "0.1.0-beta.9",
+  "description": "Mirror a NativeScript project into an ns-edge project from a terminal or a Vite dev server",
+  "license": "Apache-2.0",
+  "type": "module",
+  "bin": {
+    "ns-edge": "./dist/bin.js"
+  },
+  "exports": {
+    ".": "./dist/sync.js",
+    "./vite": "./dist/vite.js"
+  },
+  "scripts": {
+    "build": "tsc -p .",
+    "typecheck": "tsc -p . --noEmit",
+    "prepack": "npm run build"
+  },
+  "dependencies": {
+    "qrcode": "^1.5.4"
+  },
+  "devDependencies": {
+    "@types/node": "^24.0.0",
+    "@types/qrcode": "^1.5.6",
+    "typescript": "^6.0.0",
+    "vite": "^8.3.5"
+  },
+  "peerDependencies": {
+    "vite": ">=6"
+  },
+  "peerDependenciesMeta": {
+    "vite": {
+      "optional": true
+    }
+  },
+  "files": [
+    "dist"
+  ],
+  "publishConfig": {
+    "access": "public",
+    "tag": "beta"
+  }
+}