@shopify/cli-hydrogen 11.1.9 → 11.1.11

package/dist/lib/mini-oxygen/workerd.js

@@ -1,13 +1,13 @@
 import { createRequire } from 'node:module';
 import { resolvePath, dirname } from '@shopify/cli-kit/node/path';
-import { readFile, createFileReadStream } from '@shopify/cli-kit/node/fs';
+import { createFileReadStream, readFile } from '@shopify/cli-kit/node/fs';
 import { renderSuccess } from '@shopify/cli-kit/node/ui';
 import { outputNewline } from '@shopify/cli-kit/node/output';
 import { AbortError } from '@shopify/cli-kit/node/error';
 import colors from '@shopify/cli-kit/node/colors';
 import { handleMiniOxygenImportFail, SUBREQUEST_PROFILER_ENDPOINT, logRequestLine } from './common.js';
 import { TUNNEL_DOMAIN, getUtilityBannerlines, getDebugBannerLine } from '../dev-shared.js';
-import { setConstructors, handleDebugNetworkRequest, createLogRequestEvent, H2O_BINDING_NAME } from '../request-events.js';
+import { setConstructors, handleDebugNetworkRequest, H2O_BINDING_NAME, createLogRequestEvent } from '../request-events.js';
 import { importLocal } from '../import-utils.js';
 
 async function startWorkerdServer({
@@ -28,9 +28,7 @@ async function startWorkerdServer({
   setConstructors({ Response });
   async function handleCustomerAccountSchema() {
     const require2 = createRequire(import.meta.url);
-    const filePath = require2.resolve(
-      "@shopify/hydrogen/customer-account.schema.json"
-    );
+    const filePath = require2.resolve("@shopify/hydrogen/customer-account.schema.json");
     return new Response(createFileReadStream(filePath), {
       headers: { "Content-Type": "application/json" }
     });

package/dist/lib/onboarding/common.js

@@ -1,6 +1,6 @@
 import { symlink, readdir } from 'node:fs/promises';
 import { packageManagerFromUserAgent, installNodeModules } from '@shopify/cli-kit/node/node-package-manager';
-import { renderConfirmationPrompt, renderInfo, renderTextPrompt, renderSelectPrompt, renderWarning, renderSuccess, renderFatalError } from '@shopify/cli-kit/node/ui';
+import { renderConfirmationPrompt, renderInfo, renderTextPrompt, renderSelectPrompt, renderFatalError, renderWarning, renderSuccess } from '@shopify/cli-kit/node/ui';
 import { hyphenate, capitalize } from '@shopify/cli-kit/common/string';
 import { joinPath, resolvePath, basename } from '@shopify/cli-kit/node/path';
 import { initializeGitRepository, addAllToGitFromDirectory, createGitCommit } from '@shopify/cli-kit/node/git';
@@ -15,7 +15,7 @@ import { titleize } from '../string.js';
 import { ALIAS_NAME, createPlatformShortcut } from '../shell.js';
 import { transpileProject } from '../transpile/index.js';
 import { renderCssPrompt, setupCssStrategy, CSS_STRATEGY_NAME_MAP } from '../setups/css/index.js';
-import { renderRoutePrompt, generateRoutes, generateProjectFile } from '../setups/routes/generate.js';
+import { generateRoutes, generateProjectFile } from '../setups/routes/generate.js';
 import { execAsync } from '../process.js';
 import { getStorefronts } from '../graphql/admin/link-storefront.js';
 import { isHydrogenMonorepo, getSkeletonSourceDir, getRepoNodeModules } from '../build.js';
@@ -42,32 +42,25 @@ async function handleI18n(controller, cliCommand, flagI18n) {
     }
   };
 }
-async function handleRouteGeneration(controller, flagRoutes) {
-  const routesToScaffold = flagRoutes === true ? "all" : flagRoutes === false ? [] : await renderRoutePrompt({
-    abortSignal: controller.signal
-  });
-  const needsRouteGeneration = routesToScaffold === "all" || routesToScaffold.length > 0;
+function handleRouteGeneration(controller) {
   return {
-    needsRouteGeneration,
     setupRoutes: async (directory, language, options) => {
-      if (needsRouteGeneration) {
-        const result = await generateRoutes(
-          {
-            routeName: routesToScaffold,
-            directory,
-            force: true,
-            typescript: language === "ts",
-            localePrefix: options?.i18nStrategy === "subfolders" ? "locale" : false,
-            signal: controller.signal,
-            ...options
-          },
-          {
-            rootDirectory: directory,
-            appDirectory: joinPath(directory, "app")
-          }
-        );
-        return result.routeGroups;
-      }
+      const result = await generateRoutes(
+        {
+          routeName: "all",
+          directory,
+          force: true,
+          typescript: language === "ts",
+          localePrefix: options?.i18nStrategy === "subfolders" ? "locale" : false,
+          signal: controller.signal,
+          ...options
+        },
+        {
+          rootDirectory: directory,
+          appDirectory: joinPath(directory, "app")
+        }
+      );
+      return result.routeGroups;
     }
   };
 }
@@ -284,6 +277,8 @@ async function handleDependencies(projectDir, controller, packageManagerFromFlag
         cancellationMessage: "No",
         abortSignal: controller.signal
       });
+    } else {
+      actualPackageManager = detectedPackageManager;
     }
   }
   if (isHydrogenMonorepo) {

package/dist/lib/onboarding/local.js

@@ -2,8 +2,7 @@ import { cp } from 'node:fs/promises';
 import { writeFile } from '@shopify/cli-kit/node/fs';
 import { relativePath, joinPath } from '@shopify/cli-kit/node/path';
 import { hyphenate } from '@shopify/cli-kit/common/string';
-import colors from '@shopify/cli-kit/node/colors';
-import { renderSelectPrompt, renderSuccess, renderConfirmationPrompt, renderTasks } from '@shopify/cli-kit/node/ui';
+import { renderSelectPrompt, renderSuccess, renderTasks } from '@shopify/cli-kit/node/ui';
 import { handleStorefrontLink, handleProjectLocation, createAbortHandler, generateProjectEntries, handleLanguage, createInitialCommit, handleCssStrategy, commitAll, handleDependencies, handleCliShortcut, handleI18n, handleRouteGeneration, renderProjectReady } from './common.js';
 import { createStorefront } from '../graphql/admin/create-storefront.js';
 import { waitForJob } from '../graphql/admin/fetch-job.js';
@@ -49,7 +48,7 @@ async function setupLocalStarterTemplate(options, controller) {
     {
       force: true,
       recursive: true,
-      filter: (filepath) => !/^(app\/|dist\/|node_modules\/|server\.ts|\.shopify\/)/i.test(
+      filter: (filepath) => !/^(app(\/|$)|dist(\/|$)|node_modules(\/|$)|server\.ts$|\.shopify(\/|$))/i.test(
         relativePath(templateDir, filepath)
       )
     }
@@ -217,65 +216,53 @@ async function setupLocalStarterTemplate(options, controller) {
       ]
     });
   }
-  const continueWithSetup = (options.i18n ?? options.routes) !== void 0 || await renderConfirmationPrompt({
-    message: "Do you want to scaffold routes and core functionality?",
-    confirmationMessage: "Yes, set up now",
-    cancellationMessage: "No, set up later " + colors.dim(`(run \`${setupSummary.cliCommand} setup\`)`),
-    abortSignal: controller.signal
-  });
-  if (continueWithSetup) {
-    const { i18nStrategy, setupI18n } = await handleI18n(
-      controller,
-      setupSummary.cliCommand,
-      options.i18n
-    );
-    const { setupRoutes } = await handleRouteGeneration(
-      controller,
-      options.routes ?? true
-      // TODO: Remove default value when multi-select UI component is available
-    );
-    setupSummary.i18n = i18nStrategy;
-    backgroundWorkPromise = backgroundWorkPromise.then(async () => {
-      await setupI18n({
-        rootDirectory: project.directory,
-        contextCreate: language === "ts" ? "app/lib/context.ts" : "app/lib/context.js"
-      }).then(
-        () => options.git ? commitAll(
-          project.directory,
-          `Setup markets support using ${i18nStrategy}`
-        ) : void 0
-      ).catch((error) => {
-        setupSummary.i18nError = error;
-      });
-      await setupRoutes(project.directory, language, {
-        i18nStrategy,
-        // The init process might have added and modified files. Do not overwrite them.
-        // E.g. CSS imports might have been added to the root.
-        overwriteFileDeps: false
-      }).then(async (routes) => {
-        setupSummary.routes = routes;
-        if (language === "ts" && setupSummary.depsInstalled) {
-          try {
-            await execAsync("npx react-router typegen", {
-              cwd: project.directory
-            });
-          } catch (error) {
-            outputWarn(
-              "Failed to generate React Router types after route generation. You may need to run `npx react-router typegen` manually."
-            );
-          }
-        }
-        if (options.git && routes) {
-          return commitAll(
-            project.directory,
-            `Generate routes for core functionality`
+  const { i18nStrategy, setupI18n } = await handleI18n(
+    controller,
+    setupSummary.cliCommand,
+    options.i18n
+  );
+  const { setupRoutes } = handleRouteGeneration(controller);
+  setupSummary.i18n = i18nStrategy;
+  backgroundWorkPromise = backgroundWorkPromise.then(async () => {
+    await setupI18n({
+      rootDirectory: project.directory,
+      contextCreate: language === "ts" ? "app/lib/context.ts" : "app/lib/context.js"
+    }).then(
+      () => options.git ? commitAll(
+        project.directory,
+        `Setup markets support using ${i18nStrategy}`
+      ) : void 0
+    ).catch((error) => {
+      setupSummary.i18nError = error;
+    });
+    await setupRoutes(project.directory, language, {
+      i18nStrategy,
+      // The init process might have added and modified files. Do not overwrite them.
+      // E.g. CSS imports might have been added to the root.
+      overwriteFileDeps: false
+    }).then(async (routes) => {
+      setupSummary.routes = routes;
+      if (language === "ts" && setupSummary.depsInstalled) {
+        try {
+          await execAsync("npx react-router typegen", {
+            cwd: project.directory
+          });
+        } catch (error) {
+          outputWarn(
+            "Failed to generate React Router types after route generation. You may need to run `npx react-router typegen` manually."
           );
         }
-      }).catch((error) => {
-        setupSummary.routesError = error;
-      });
+      }
+      if (options.git && routes) {
+        return commitAll(
+          project.directory,
+          `Generate routes for core functionality`
+        );
+      }
+    }).catch((error) => {
+      setupSummary.routesError = error;
     });
-  }
+  });
   await renderTasks(tasks);
   if (options.git) {
     await commitAll(project.directory, "Lockfile");

package/dist/lib/template-pack.js

@@ -0,0 +1,84 @@
+import { execFileSync } from 'node:child_process';
+import { readFile, writeFile, mkdtemp, rm } from 'node:fs/promises';
+import { join } from 'node:path';
+import { tmpdir } from 'node:os';
+
+const DEPENDENCY_SECTIONS = [
+  "dependencies",
+  "devDependencies",
+  "peerDependencies",
+  "optionalDependencies"
+];
+function hasReplaceableProtocol(version) {
+  return version.startsWith("workspace:") || version.startsWith("catalog:");
+}
+async function getPackedTemplatePackageJson(sourceTemplateDir) {
+  const tempDir = await mkdtemp(join(tmpdir(), "hydrogen-template-pack-"));
+  try {
+    const rawPackResult = execFileSync(
+      "pnpm",
+      ["pack", "--pack-destination", tempDir, "--json"],
+      {
+        cwd: sourceTemplateDir,
+        encoding: "utf8"
+      }
+    );
+    const parsedResult = JSON.parse(rawPackResult.trim());
+    const packedTarball = Array.isArray(parsedResult) ? parsedResult[0]?.filename : parsedResult.filename;
+    if (!packedTarball) {
+      throw new Error("pnpm pack did not return a tarball filename.");
+    }
+    const packedManifestRaw = execFileSync(
+      "tar",
+      [
+        "-xOf",
+        packedTarball.startsWith("/") ? packedTarball : join(tempDir, packedTarball),
+        "package/package.json"
+      ],
+      { encoding: "utf8" }
+    );
+    return JSON.parse(packedManifestRaw);
+  } finally {
+    await rm(tempDir, { recursive: true, force: true });
+  }
+}
+function replaceWorkspaceProtocolVersionsInPackageJson({
+  packedManifest,
+  targetPackageJson
+}) {
+  for (const section of DEPENDENCY_SECTIONS) {
+    const targetDeps = targetPackageJson[section];
+    if (!targetDeps) continue;
+    for (const [name, version] of Object.entries(targetDeps)) {
+      if (!hasReplaceableProtocol(version)) continue;
+      const packedVersion = packedManifest[section]?.[name];
+      if (!packedVersion) {
+        throw new Error(
+          `Unable to resolve ${name} from ${section} in packed template manifest.`
+        );
+      }
+      targetDeps[name] = packedVersion;
+    }
+  }
+}
+async function replaceWorkspaceProtocolVersions({
+  sourceTemplateDir,
+  targetTemplateDir
+}) {
+  const packedManifest = await getPackedTemplatePackageJson(sourceTemplateDir);
+  const targetPackageJsonPath = join(targetTemplateDir, "package.json");
+  const targetPackageJson = JSON.parse(
+    await readFile(targetPackageJsonPath, "utf8")
+  );
+  replaceWorkspaceProtocolVersionsInPackageJson({
+    packedManifest,
+    targetPackageJson
+  });
+  await writeFile(
+    targetPackageJsonPath,
+    `${JSON.stringify(targetPackageJson, null, 2)}
+`
+  );
+}
+
+export { replaceWorkspaceProtocolVersions };

package/oclif.manifest.json

@@ -1048,13 +1048,6 @@
           "allowNo": true,
           "type": "boolean"
         },
-        "routes": {
-          "description": "Generate routes for all pages.",
-          "env": "SHOPIFY_HYDROGEN_FLAG_ROUTES",
-          "name": "routes",
-          "allowNo": true,
-          "type": "boolean"
-        },
         "git": {
           "description": "Init Git and create initial commits.",
           "env": "SHOPIFY_HYDROGEN_FLAG_GIT",
@@ -1063,7 +1056,7 @@
           "type": "boolean"
         },
         "quickstart": {
-          "description": "Scaffolds a new Hydrogen project with a set of sensible defaults. Equivalent to `shopify hydrogen init --path hydrogen-quickstart --mock-shop --language js --shortcut --routes --markets none`",
+          "description": "Scaffolds a new Hydrogen project with a set of sensible defaults. Equivalent to `shopify hydrogen init --path hydrogen-quickstart --mock-shop --language js --shortcut --markets none`",
           "env": "SHOPIFY_HYDROGEN_FLAG_QUICKSTART",
           "name": "quickstart",
           "allowNo": false,
@@ -1683,5 +1676,5 @@
       ]
     }
   },
-  "version": "11.1.9"
+  "version": "11.1.11"
 }

package/package.json

@@ -4,7 +4,7 @@
     "access": "public",
     "@shopify:registry": "https://registry.npmjs.org"
   },
-  "version": "11.1.9",
+  "version": "11.1.11",
   "license": "MIT",
   "type": "module",
   "repository": {
@@ -12,18 +12,12 @@
     "url": "git+https://github.com/Shopify/hydrogen.git",
     "directory": "packages/cli-hydrogen"
   },
-  "scripts": {
-    "build": "tsup && node scripts/build-check.mjs",
-    "dev": "tsup --watch ./src --watch ../../templates/skeleton",
-    "typecheck": "tsc --noEmit",
-    "generate:manifest": "node scripts/generate-manifest.mjs",
-    "test": "cross-env SHOPIFY_UNIT_TEST=1 LANG=en-US.UTF-8 vitest run --test-timeout=60000",
-    "test:watch": "cross-env SHOPIFY_UNIT_TEST=1 LANG=en-US.UTF-8 vitest --test-timeout=60000"
-  },
   "devDependencies": {
     "@react-router/dev": "7.12.0",
     "@types/diff": "^5.0.2",
     "@types/gunzip-maybe": "^1.4.0",
+    "@types/node": "^22",
+    "esbuild": "^0.25.0",
     "@types/prettier": "^2.7.2",
     "@types/source-map-support": "^0.5.10",
     "@types/tar-fs": "^2.0.1",
@@ -46,10 +40,11 @@
     "chokidar": "3.5.3",
     "cli-truncate": "^4.0.0",
     "diff": "^5.1.0",
+    "esbuild": "^0.25.12",
     "get-east-asian-width": "^1.3.0",
     "get-port": "^7.0.0",
     "gunzip-maybe": "^1.4.2",
-    "prettier": "^2.8.4",
+    "prettier": "^3.4.2",
     "semver": "^7.7.1",
     "source-map": "^0.7.4",
     "source-map-support": "^0.5.21",
@@ -61,10 +56,10 @@
   "peerDependencies": {
     "@graphql-codegen/cli": "^5.0.2",
     "@react-router/dev": "7.12.0",
-    "@shopify/hydrogen-codegen": "^0.3.3",
-    "@shopify/mini-oxygen": "^4.0.0",
     "graphql-config": "^5.0.3",
-    "vite": "^5.1.0 || ^6.2.0"
+    "vite": "^5.1.0 || ^6.2.0",
+    "@shopify/hydrogen-codegen": "0.3.3",
+    "@shopify/mini-oxygen": "4.0.1"
   },
   "peerDependenciesMeta": {
     "@graphql-codegen/cli": {
@@ -103,7 +98,7 @@
     "oclif.manifest.json"
   ],
   "engines": {
-    "node": ">=18.0.0"
+    "node": "^20 || ^22 || ^24"
   },
   "oclif": {
     "commands": "dist/commands",
@@ -130,5 +125,13 @@
     "plugins": [
       "@shopify/plugin-cloudflare"
     ]
+  },
+  "scripts": {
+    "build": "tsup && node scripts/build-check.mjs",
+    "dev": "tsup --watch ./src --watch ../../templates/skeleton",
+    "typecheck": "tsc --noEmit",
+    "generate:manifest": "node scripts/generate-manifest.mjs",
+    "test": "cross-env SHOPIFY_UNIT_TEST=1 LANG=en-US.UTF-8 vitest run --test-timeout=60000",
+    "test:watch": "cross-env SHOPIFY_UNIT_TEST=1 LANG=en-US.UTF-8 vitest --test-timeout=60000"
   }
-}
+}

package/dist/lib/react-router-version-check.js

@@ -1,82 +0,0 @@
-import { readFile } from '@shopify/cli-kit/node/fs';
-import { joinPath } from '@shopify/cli-kit/node/path';
-import { renderWarning } from '@shopify/cli-kit/node/ui';
-import { outputDebug } from '@shopify/cli-kit/node/output';
-import semver from 'semver';
-
-const REACT_ROUTER_PACKAGES = [
-  "react-router",
-  "react-router-dom",
-  "@react-router/dev",
-  "@react-router/fs-routes"
-];
-const EXPECTED_VERSION = "7.12.0";
-async function checkReactRouterVersions(appPath) {
-  const mismatches = [];
-  const packageJsonPath = joinPath(appPath, "package.json");
-  let packageJson;
-  try {
-    packageJson = JSON.parse(await readFile(packageJsonPath));
-  } catch (error) {
-    outputDebug(
-      `Unable to read package.json for React Router version check: ${error}`
-    );
-    return;
-  }
-  const allDeps = {
-    ...packageJson.dependencies,
-    ...packageJson.devDependencies,
-    ...packageJson.peerDependencies
-  };
-  for (const pkg of REACT_ROUTER_PACKAGES) {
-    const installedVersion = allDeps[pkg];
-    if (!installedVersion) {
-      continue;
-    }
-    installedVersion.replace(/^[\^~]/, "");
-    if (!semver.satisfies(EXPECTED_VERSION, installedVersion)) {
-      mismatches.push({
-        package: pkg,
-        installed: installedVersion,
-        expected: EXPECTED_VERSION
-      });
-    }
-  }
-  if (mismatches.length > 0) {
-    const mismatchList = mismatches.map(
-      (m) => `  \u2022 ${m.package}: installed ${m.installed}, expected ${m.expected}`
-    ).join("\n");
-    const devPackages = ["@react-router/dev", "@react-router/fs-routes"];
-    const regularMismatches = mismatches.filter(
-      (m) => !devPackages.includes(m.package)
-    );
-    const devMismatches = mismatches.filter(
-      (m) => devPackages.includes(m.package)
-    );
-    const commands = [];
-    if (regularMismatches.length > 0) {
-      const regularList = regularMismatches.map((m) => `${m.package}@${EXPECTED_VERSION}`).join(" ");
-      commands.push(`npm install ${regularList}`);
-    }
-    if (devMismatches.length > 0) {
-      const devList = devMismatches.map((m) => `${m.package}@${EXPECTED_VERSION}`).join(" ");
-      commands.push(`npm install -D ${devList}`);
-    }
-    renderWarning({
-      headline: "React Router version mismatch detected",
-      body: [
-        "Hydrogen requires React Router 7.12.0 for proper functionality.",
-        "",
-        "Version mismatches found:",
-        mismatchList,
-        "",
-        "To fix this issue, run:",
-        ...commands.map((cmd) => `  ${cmd}`),
-        "",
-        "This may cause issues with routing, code splitting, and other features."
-      ].join("\n")
-    });
-  }
-}
-
-export { checkReactRouterVersions };