@swell/cli 2.9.17 → 2.9.19

package/dist/lib/apps/index.d.ts

@@ -28,6 +28,8 @@ export interface App {
         deployment_hash?: string;
         deployment_id?: string;
         framework?: string;
+        hosting?: 'managed' | 'self-hosted';
+        package_id?: string;
         service?: string;
         url?: string;
     };
@@ -39,8 +41,10 @@ export interface App {
     }>;
     id?: string;
     images?: Array<{
-        file?: unknown;
+        description?: string;
         id: string;
+        image_src?: unknown;
+        title?: string;
     }>;
     installed?: {
         date_created: string;
@@ -144,20 +148,16 @@ export declare enum ConfigInputFields {
     VERSION = "version"
 }
 export interface FrontendProjectType {
-    appTypes?: string[];
     buildCommand?: string;
     devCommand: string;
-    displayOrder?: number;
-    installCommand?: string;
     mainPackage: string;
     name: string;
-    provisionsStorefront?: boolean;
     slug: string;
 }
 export declare const CUSTOM_FRAMEWORK_SLUG = "custom";
 export declare const FrontendProjectTypes: FrontendProjectType[];
-export declare function getFrontendProjectSlugs(withNone?: boolean, withLegacy?: boolean): string[];
-export declare function getFrontendProjectValidValues(withNone?: boolean, withLegacy?: boolean): string;
+export declare function getFrontendProjectSlugs(withNone?: boolean): string[];
+export declare function getFrontendProjectValidValues(withNone?: boolean): string;
 export declare function getFrontendProjectType(appPath: string): Promise<FrontendProjectType | undefined>;
 /**
  * Get project commands transformed for the detected package manager.

package/dist/lib/apps/index.js

@@ -125,23 +125,20 @@ export const CUSTOM_FRAMEWORK_SLUG = 'custom';
 // Pinned by test/lib/frontend-detection.test.ts.
 export const FrontendProjectTypes = [
     {
-        // Template ref is `main`; pin to an immutable tag before announcement.
-        // `--no-agents` pre-answers C3's agents-helper prompt so install
-        // doesn't hang behind our spinner.
-        appTypes: ['storefront'],
         devCommand: 'npm run dev -- --port ${PORT}',
-        displayOrder: 7,
-        installCommand: 'npm create cloudflare@latest -- frontend --template=swellstores/storefront-react-ai-template#main --deploy=false --git=false --no-agents',
         mainPackage: '@swell/storefront-app-sdk-react',
         name: 'Swell React Storefront',
-        provisionsStorefront: true,
         slug: 'react-storefront',
     },
+    {
+        devCommand: 'npm run dev -- --port ${PORT}',
+        mainPackage: 'vinext',
+        name: 'Vinext',
+        slug: 'vinext',
+    },
     {
         buildCommand: 'npx astro build',
         devCommand: 'npx astro dev --port ${PORT}',
-        displayOrder: 2,
-        installCommand: 'npm create cloudflare@latest -- frontend --framework=astro --deploy=false --git=false -- --no-git --yes --skip-houston --typescript strict',
         mainPackage: 'astro',
         name: 'Astro',
         slug: 'astro',
@@ -149,16 +146,12 @@ export const FrontendProjectTypes = [
     {
         buildCommand: 'npx ng build',
         devCommand: 'npx ng serve --port ${PORT}',
-        displayOrder: 6,
-        installCommand: 'npm create cloudflare@latest -- frontend --framework=angular --deploy=false --git=false -- --style=sass --zoneless --ai-config=none',
         mainPackage: '@angular/core',
         name: 'Angular',
         slug: 'angular',
     },
     {
         devCommand: 'npm run dev -- --port ${PORT}',
-        displayOrder: 5,
-        installCommand: 'npm create cloudflare@latest -- frontend --framework=hono  --deploy=false --git=false',
         mainPackage: 'hono',
         name: 'Hono',
         slug: 'hono',
@@ -166,8 +159,6 @@ export const FrontendProjectTypes = [
     {
         buildCommand: 'npx nuxt build',
         devCommand: 'npx nuxt dev --port ${PORT}',
-        displayOrder: 3,
-        installCommand: 'npm create cloudflare@latest -- frontend --framework=nuxt --deploy=false --git=false -- --no-modules -f',
         mainPackage: 'nuxt',
         name: 'Nuxt',
         slug: 'nuxt',
@@ -175,40 +166,26 @@ export const FrontendProjectTypes = [
     {
         buildCommand: 'npx opennextjs-cloudflare build',
         devCommand: 'npx next dev --turbopack --port ${PORT}',
-        displayOrder: 1,
-        installCommand: 'npm create cloudflare@latest -- frontend --framework=next --deploy=false --git=false -- --typescript --use-npm --src-dir --app --eslint --import-alias "@/*" --tailwind --turbopack',
         mainPackage: 'next',
         name: 'Next.js',
         slug: 'nextjs',
     },
     {
-        // `--variant=react-ts` pre-answers C3's variant prompt (TS Vite +
-        // plugin-react, not SWC) so install doesn't hang behind our spinner.
         devCommand: 'npm run dev -- --port ${PORT}',
-        displayOrder: 4,
-        installCommand: 'npm create cloudflare@latest -- frontend --framework=react --deploy=false --git=false --variant=react-ts',
         mainPackage: 'react',
         name: 'React',
         slug: 'react',
     },
 ];
-export function getFrontendProjectSlugs(withNone = true, withLegacy = true) {
-    const types = withLegacy
-        ? FrontendProjectTypes
-        : FrontendProjectTypes.filter((projectType) => projectType.installCommand);
-    // Sort so user-facing surfaces match the prompt; detection order is
-    // independent.
-    const slugs = [...types]
-        .sort((a, b) => (a.displayOrder ?? Number.POSITIVE_INFINITY) -
-        (b.displayOrder ?? Number.POSITIVE_INFINITY))
-        .map((projectType) => projectType.slug);
+export function getFrontendProjectSlugs(withNone = true) {
+    const slugs = FrontendProjectTypes.map((projectType) => projectType.slug);
     if (withNone) {
         slugs.push('none');
     }
     return slugs;
 }
-export function getFrontendProjectValidValues(withNone = true, withLegacy = true) {
-    return getFrontendProjectSlugs(withNone, withLegacy).join(', ');
+export function getFrontendProjectValidValues(withNone = true) {
+    return getFrontendProjectSlugs(withNone).join(', ');
 }
 export async function getFrontendProjectType(appPath) {
     // Try frontend/package.json first (workspace structure), then root package.json (legacy)

package/dist/lib/apps/storefront-resources.d.ts

@@ -18,8 +18,9 @@ export interface StorefrontResourceResult {
 /**
  * Ensure the remote development app and its storefront exist.
  *
- * `swell create app --frontend react-storefront` calls this after the local
- * scaffold succeeds. Retrying is safe: existing resources are reused.
+ * `swell create app --frontend swell-spa` (or its `react-storefront` alias)
+ * calls this after the local scaffold succeeds. Retrying is safe: existing
+ * resources are reused.
  *
  * @param api authenticated Swell API client
  * @param input storefront app identity from the generated swell.json

package/dist/lib/apps/storefront-resources.js

@@ -2,8 +2,9 @@ import config from '../config.js';
 /**
  * Ensure the remote development app and its storefront exist.
  *
- * `swell create app --frontend react-storefront` calls this after the local
- * scaffold succeeds. Retrying is safe: existing resources are reused.
+ * `swell create app --frontend swell-spa` (or its `react-storefront` alias)
+ * calls this after the local scaffold succeeds. Retrying is safe: existing
+ * resources are reused.
  *
  * @param api authenticated Swell API client
  * @param input storefront app identity from the generated swell.json

package/dist/push-app-command.js

@@ -6,6 +6,8 @@ import * as path from 'node:path';
 import Stream from 'node:stream';
 import ora from 'ora';
 import { default as swellConfig } from './lib/app-config.js';
+import { buildFrontendPackage, getManagedFrontendFramework, } from './lib/apps/frontend-package.js';
+import { warnFrontendRouteCollisions } from './lib/apps/frontend-routes.js';
 import { ConfigType, getFrontendProjectValidValues, allConfigFilesInDir, CUSTOM_FRAMEWORK_SLUG, appConfigFromFile, filePathExistsAsync, findAppConfig, getConfigTypeFromPath, getConfigTypeKeyFromValue, getFrontendProjectType, getProjectCommands, globAllFilesByPath, hashString, isPathDirectory, toPosixPath, } from './lib/apps/index.js';
 import { getGlobIgnorePathsChecker } from './lib/apps/paths.js';
 import { slugFromApp } from './lib/apps/slug.js';
@@ -249,6 +251,24 @@ export class PushAppCommand extends RemoteAppCommand {
     }
     async deployAppFrontend(force, log) {
         const currentStore = localConfig.getDefaultStore();
+        if (this.swellConfig.store.frontend?.hosting === 'managed') {
+            const frontend = path.join(this.appPath, 'frontend');
+            const framework = await getManagedFrontendFramework(frontend);
+            await warnFrontendRouteCollisions(this.appPath, framework, (message) => this.warn(message));
+            this.log(`Building managed ${framework} frontend...`);
+            const pkg = await buildFrontendPackage(frontend, framework);
+            const serialized = JSON.stringify(pkg);
+            if (Buffer.byteLength(serialized) > 8 * 1024 * 1024) {
+                this.error('Managed frontend package exceeds the 8 MiB upload limit.');
+            }
+            await this.handleRequestErrors(async () => this.api.post({ adminPath: `/apps/${this.app.id}/frontend-package` }, { body: { package: serialized } }));
+            this.log(`Deployed managed frontend package ${pkg.digest}.`);
+            return;
+        }
+        if (this.app.frontend?.hosting === 'managed' &&
+            !this.swellConfig.store.frontend?.hosting) {
+            this.error('Set frontend.hosting to self-hosted explicitly to change hosting.');
+        }
         const projectType = await this.getFrontendProjectType(false);
         if (!projectType) {
             return;
@@ -257,6 +277,7 @@ export class PushAppCommand extends RemoteAppCommand {
         // Build and deploy only if there are files to push
         if (deploymentHash &&
             (force || deploymentHash !== this.app.frontend?.deployment_hash)) {
+            await warnFrontendRouteCollisions(this.appPath, projectType.slug, (message) => this.warn(message));
             await this.buildFrontend(projectType);
             const deploymentUrl = await this.deployFrontend(projectType);
             await this.updateFrontendDeployment(currentStore, projectType, deploymentUrl, deploymentHash);
@@ -829,6 +850,7 @@ export class PushAppCommand extends RemoteAppCommand {
                 $client_id: currentStore,
                 $environment_id: 'test',
                 frontend: {
+                    hosting: 'self-hosted',
                     deployment_hash: deploymentHash,
                     ...(projectType.slug !== CUSTOM_FRAMEWORK_SLUG && {
                         framework: projectType.slug,

package/dist/remote-app-command.js

@@ -188,6 +188,12 @@ export class RemoteAppCommand extends AppCommand {
         }
         const body = {
             ...this.swellConfig.store,
+            // A hosting declaration is not deployment state. Only an explicit
+            // self-hosted URL can be applied before the deployment step succeeds.
+            frontend: this.swellConfig.store.frontend?.hosting !== 'managed' &&
+                this.swellConfig.store.frontend?.url
+                ? this.swellConfig.store.frontend
+                : undefined,
             // we store locally the private id as the id, but we need to switch it
             // when posting to the API
             id: undefined,

package/dist/types/index.d.ts

@@ -75,6 +75,11 @@ export interface UserAuthorization {
     client_inactive?: boolean;
 }
 export interface App {
+    frontend?: {
+        framework?: string;
+        hosting?: 'managed' | 'self-hosted';
+        url?: string;
+    };
     id: string;
     name: string;
     type: string;

package/oclif.manifest.json

@@ -877,27 +877,23 @@
         "$ swell app init my-app",
         "$ swell app init -t admin -y",
         "$ swell app init my-app -t admin -y",
-        "$ swell app init my-app -t admin --frontend astro -y",
         "$ swell app init my_theme -t theme --storefront-app proxima -y"
       ],
       "flags": {
         "frontend": {
-          "description": "Framework: nextjs | astro | nuxt | react | hono | angular | react-storefront | none",
+          "hidden": true,
           "name": "frontend",
           "hasDynamicHelp": false,
           "multiple": false,
-          "options": [
-            "nextjs",
-            "astro",
-            "nuxt",
-            "react",
-            "hono",
-            "angular",
-            "react-storefront",
-            "none"
-          ],
           "type": "option"
         },
+        "yes": {
+          "char": "y",
+          "description": "Skip prompts; use defaults for optional values",
+          "name": "yes",
+          "allowNo": false,
+          "type": "boolean"
+        },
         "storefront-app": {
           "description": "Target storefront app ID",
           "name": "storefront-app",
@@ -925,13 +921,6 @@
           "multiple": false,
           "type": "option"
         },
-        "yes": {
-          "char": "y",
-          "description": "Skip prompts, require all arguments",
-          "name": "yes",
-          "allowNo": false,
-          "type": "boolean"
-        },
         "pkg": {
           "char": "p",
           "description": "Package manager: npm | yarn | pnpm | bun | none",
@@ -1008,27 +997,25 @@
             {
               "name": "admin",
               "description": "Dashboard extension",
-              "optional": [
-                "--frontend"
-              ]
+              "optional": []
             },
             {
               "name": "storefront",
               "description": "Hosted storefront",
-              "optional": [
-                "--frontend"
-              ]
+              "optional": []
             },
             {
               "name": "theme",
               "description": "Theme for existing storefront",
               "requires": [
                 "--storefront-app"
-              ]
+              ],
+              "optional": []
             },
             {
               "name": "integration",
               "description": "Third-party service",
+              "optional": [],
               "requires": [
                 "--integration-type",
                 "--integration-id (for payment | shipping | tax)"
@@ -1452,29 +1439,40 @@
       "examples": [
         "$ swell create app",
         "$ swell create app my_app -t admin -y",
-        "$ swell create app my_app -t admin --frontend astro -y",
+        "$ swell create app my_app -t admin --frontend swell-react -y",
+        "$ swell create app my_shop -t storefront --frontend swell-spa -y",
         "$ swell create app my_theme -t theme --storefront-app proxima -y",
-        "$ swell create app my_payment -t integration --integration-type payment --integration-id card -y",
-        "$ swell create app my_shipping -t integration --integration-type shipping --integration-id fedex -y"
+        "$ swell create app my_payment -t integration --integration-type payment --integration-id card -y"
       ],
       "flags": {
         "frontend": {
-          "description": "Framework: nextjs | astro | nuxt | react | hono | angular | react-storefront | none",
+          "description": "Frontend template; see FRONTENDS",
           "name": "frontend",
           "hasDynamicHelp": false,
+          "helpValue": "template",
           "multiple": false,
           "options": [
+            "swell-react",
+            "swell-vinext",
+            "swell-spa",
             "nextjs",
             "astro",
             "nuxt",
             "react",
             "hono",
             "angular",
-            "react-storefront",
-            "none"
+            "none",
+            "react-storefront"
           ],
           "type": "option"
         },
+        "yes": {
+          "char": "y",
+          "description": "Skip prompts; use defaults for optional values",
+          "name": "yes",
+          "allowNo": false,
+          "type": "boolean"
+        },
         "storefront-app": {
           "description": "Target storefront app ID",
           "name": "storefront-app",
@@ -1502,13 +1500,6 @@
           "multiple": false,
           "type": "option"
         },
-        "yes": {
-          "char": "y",
-          "description": "Skip prompts, require all arguments",
-          "name": "yes",
-          "allowNo": false,
-          "type": "boolean"
-        },
         "pkg": {
           "char": "p",
           "description": "Package manager: npm | yarn | pnpm | bun | none",
@@ -1606,6 +1597,9 @@
             {
               "name": "integration",
               "description": "Third-party service",
+              "optional": [
+                "--frontend"
+              ],
               "requires": [
                 "--integration-type",
                 "--integration-id (for payment | shipping | tax)"
@@ -1619,6 +1613,7 @@
           "integration-type",
           "integration-id"
         ],
+        "frontendTemplates": "optional",
         "usageDirect": "<id> -t <type> [...] -y"
       },
       "isESM": true,
@@ -1730,67 +1725,47 @@
           "description": "Create frontend app following command prompts."
         },
         {
-          "command": "swell create frontend -y",
-          "description": "Create frontend app and accept all default values."
+          "command": "swell create frontend --frontend swell-react -y",
+          "description": "Add a React frontend hosted by Swell."
+        },
+        {
+          "command": "swell create frontend --frontend astro -y",
+          "description": "Add a self-hosted Astro frontend."
         }
       ],
       "flags": {
         "frontend": {
-          "description": "Framework: nextjs | astro | nuxt | react | hono | angular | react-storefront | none",
+          "description": "Frontend template; see FRONTENDS",
           "name": "frontend",
           "hasDynamicHelp": false,
+          "helpValue": "template",
           "multiple": false,
           "options": [
+            "swell-react",
+            "swell-vinext",
+            "swell-spa",
             "nextjs",
             "astro",
             "nuxt",
             "react",
             "hono",
             "angular",
-            "react-storefront",
-            "none"
-          ],
-          "type": "option"
-        },
-        "storefront-app": {
-          "description": "Target storefront app ID",
-          "name": "storefront-app",
-          "hasDynamicHelp": false,
-          "multiple": false,
-          "type": "option"
-        },
-        "integration-type": {
-          "description": "Integration: generic | payment | shipping | tax",
-          "name": "integration-type",
-          "hasDynamicHelp": false,
-          "multiple": false,
-          "options": [
-            "generic",
-            "payment",
-            "shipping",
-            "tax"
+            "none",
+            "react-storefront"
           ],
           "type": "option"
         },
-        "integration-id": {
-          "description": "Service ID (e.g., card, fedex)",
-          "name": "integration-id",
-          "hasDynamicHelp": false,
-          "multiple": false,
-          "type": "option"
-        },
         "yes": {
           "char": "y",
-          "description": "Skip prompts, require all arguments",
+          "description": "Skip prompts; use defaults for optional values",
           "name": "yes",
           "allowNo": false,
           "type": "boolean"
         },
         "pkg": {
           "char": "p",
-          "description": "Package manager: npm | yarn | pnpm | bun | none",
+          "description": "Package manager: npm | yarn | pnpm | bun | none (default: the workspace lockfile, else npm)",
           "name": "pkg",
-          "default": "npm",
           "hasDynamicHelp": false,
           "multiple": false,
           "options": [
@@ -1811,6 +1786,10 @@
       "pluginType": "core",
       "strict": true,
       "enableJsonFlag": false,
+      "helpMeta": {
+        "frontendTemplates": "required",
+        "usageDirect": "--frontend <template> [...] -y"
+      },
       "isESM": true,
       "relativePath": [
         "dist",
@@ -3145,22 +3124,19 @@
       ],
       "flags": {
         "frontend": {
-          "description": "Framework: nextjs | astro | nuxt | react | hono | angular | react-storefront | none",
+          "hidden": true,
           "name": "frontend",
           "hasDynamicHelp": false,
           "multiple": false,
-          "options": [
-            "nextjs",
-            "astro",
-            "nuxt",
-            "react",
-            "hono",
-            "angular",
-            "react-storefront",
-            "none"
-          ],
           "type": "option"
         },
+        "yes": {
+          "char": "y",
+          "description": "Skip prompts; use defaults for optional values",
+          "name": "yes",
+          "allowNo": false,
+          "type": "boolean"
+        },
         "storefront-app": {
           "description": "Target storefront app ID",
           "name": "storefront-app",
@@ -3188,13 +3164,6 @@
           "multiple": false,
           "type": "option"
         },
-        "yes": {
-          "char": "y",
-          "description": "Skip prompts, require all arguments",
-          "name": "yes",
-          "allowNo": false,
-          "type": "boolean"
-        },
         "pkg": {
           "char": "p",
           "description": "Package manager: npm | yarn | pnpm | bun | none",
@@ -3433,7 +3402,7 @@
     "app:frontend:deploy": {
       "aliases": [],
       "args": {},
-      "description": "Creates a new build using the relevant command depending on your frontend framework.\nOnce the build succeeds, this command will invoke Cloudflare Wrangler to upload\nbuild assets using your own Cloudflare account. Once complete, Swell will update\nthe app's deployment URL and push the updated frontend files.",
+      "description": "Creates a new build using the relevant command depending on your frontend framework.\nManaged frontends are uploaded to Swell and deployed using Swell's Cloudflare account.\nSelf-hosted frontends deploy through Wrangler using your own Cloudflare account.\nIf deployment fails, correct any reported errors and run this command again.",
       "examples": [
         "swell app frontend deploy",
         "swell app frontend deploy --force",
@@ -3603,5 +3572,5 @@
       ]
     }
   },
-  "version": "2.9.17"
+  "version": "2.9.19"
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@swell/cli",
-  "version": "2.9.17",
+  "version": "2.9.19",
   "type": "module",
   "description": "Swell's command line interface/utility",
   "keywords": [
@@ -114,8 +114,10 @@
     "postpack": "shx rm -f oclif.manifest.json",
     "posttest": "npm run lint",
     "prepack": "npm run build && oclif manifest && NODE_ENV=production oclif readme",
-    "test": "mocha --forbid-only \"test/**/*.test.ts\"",
-    "publish-alpha": "npm version prerelease --preid=alpha && npm publish --tag alpha"
+    "test": "mocha --forbid-only --ignore \"**/node_modules/**\" \"test/**/*.test.ts\"",
+    "publish-alpha": "npm version prerelease --preid=alpha && npm publish --tag alpha",
+    "test:frontend-packages": "npm run build && node test/fixtures/managed-frontend/verify.mjs && node test/fixtures/managed-frontend/verify-react-worker.mjs",
+    "test:frontend-scaffolds": "npm run build && node test/fixtures/managed-frontend/verify-scaffolds.mjs"
   },
   "engines": {
     "node": ">= 22.0.0"