@shopify/cli-hydrogen 8.1.0 → 8.2.0

package/dist/commands/hydrogen/deploy.js

@@ -59,7 +59,14 @@ class Deploy extends Command {
     "auth-bypass-token": Flags.boolean({
       description: "Generate an authentication bypass token, which can be used to perform end-to-end tests against the deployment.",
       required: false,
-      default: false
+      default: false,
+      env: "AUTH_BYPASS_TOKEN"
+    }),
+    "auth-bypass-token-duration": Flags.string({
+      description: "Specify the duration (in hours) up to 12 hours for the authentication bypass token. Defaults to `2`",
+      required: false,
+      env: "AUTH_BYPASS_TOKEN_DURATION",
+      dependsOn: ["auth-bypass-token"]
     }),
     "build-command": Flags.string({
       description: "Specify a build command to run before deploying. If not specified, `shopify hydrogen build` will be used.",
@@ -143,6 +150,7 @@ function createUnexpectedAbortError(message) {
 }
 async function runDeploy(options) {
   const {
+    authBypassTokenDuration,
     authBypassToken: generateAuthBypassToken,
     buildCommand,
     defaultEnvironment,
@@ -246,6 +254,9 @@ ${changedFiles.trimEnd()}`;
       "Environments are automatically picked up by the current Git branch."
     );
   }
+  if (isCI && envBranch) {
+    userProvidedEnvironmentTag = envBranch;
+  }
   if (!isCI) {
     deploymentData = await getOxygenDeploymentData({
       root,
@@ -336,6 +347,7 @@ ${changedFiles.trimEnd()}`;
     deploymentToken: parseToken(token),
     environmentTag: userProvidedEnvironmentTag || userChosenEnvironmentTag || fallbackEnvironmentTag,
     generateAuthBypassToken,
+    authBypassTokenDuration,
     verificationMaxDuration: 180,
     metadata: {
       ...metadataDescription ? { description: metadataDescription } : {},
@@ -367,8 +379,7 @@ ${changedFiles.trimEnd()}`;
 
 Continue?`.value
     });
-    if (!confirmPush)
-      return;
+    if (!confirmPush) return;
   }
   let resolveUpload;
   const uploadPromise = new Promise((resolve) => {

package/dist/commands/hydrogen/dev.js

@@ -115,12 +115,9 @@ async function runDev({
   cliConfig,
   verbose
 }) {
-  if (!process.env.NODE_ENV)
-    process.env.NODE_ENV = "development";
-  if (verbose)
-    setH2OVerbose();
-  if (!isH2Verbose())
-    muteDevLogs();
+  if (!process.env.NODE_ENV) process.env.NODE_ENV = "development";
+  if (verbose) setH2OVerbose();
+  if (!isH2Verbose()) muteDevLogs();
   const root = appPath ?? process.cwd();
   const cliCommandPromise = getCliCommand(root);
   const backgroundPromise = getDevConfigInBackground(

package/dist/commands/hydrogen/env/list.js

@@ -31,8 +31,7 @@ async function runEnvList({ path: root = process.cwd() }) {
     config,
     cliCommand
   });
-  if (!linkedStorefront)
-    return;
+  if (!linkedStorefront) return;
   config.storefront = linkedStorefront;
   const storefront = await getStorefrontEnvironments(
     session,

package/dist/commands/hydrogen/env/pull.js

@@ -45,8 +45,7 @@ async function runEnvPull({
     config,
     cliCommand
   });
-  if (!linkedStorefront)
-    return;
+  if (!linkedStorefront) return;
   config.storefront = linkedStorefront;
   if (envHandle || envBranch) {
     const environments = (await getStorefrontEnvironments(session, config.storefront.id))?.environments || [];
@@ -77,8 +76,7 @@ async function runEnvPull({
     return;
   }
   const variables = storefront.environmentVariables;
-  if (!variables.length)
-    return;
+  if (!variables.length) return;
   const fileName = colors.whiteBright(`.env`);
   const dotEnvPath = resolvePath(root, ".env");
   const fetchedEnv = {};

package/dist/commands/hydrogen/env/push.js

@@ -47,8 +47,7 @@ async function runEnvPush({
     config,
     cliCommand
   });
-  if (!linkedStorefront)
-    return;
+  if (!linkedStorefront) return;
   config.storefront = linkedStorefront;
   const { environments: environmentsData } = await getStorefrontEnvironments(session, config.storefront.id) ?? {};
   if (!environmentsData) {
@@ -88,22 +87,19 @@ async function runEnvPush({
   const comparableRemoteVars = remoteVars.sort((a, b) => a.key.localeCompare(b.key)).map(({ key, value }) => createDotEnvFileLine(key, value)).join("\n") + "\n";
   const compareableLocalVars = Object.keys(localVariables).sort((a, b) => a.localeCompare(b)).reduce((acc, key) => {
     const { isSecret, readOnly } = environmentVariables.find((variable) => variable.key === key) ?? {};
-    if (isSecret || readOnly)
-      return acc;
+    if (isSecret || readOnly) return acc;
     return [...acc, createDotEnvFileLine(key, localVariables[key])];
   }, []).join("\n") + "\n";
   if (!validatedEnvironment.name)
     throw new AbortError("Missing environment name");
   const remoteReadOnlyOrSecrets = environmentVariables.reduce(
     (acc, { isSecret, readOnly, key }) => {
-      if (!isSecret && !readOnly)
-        return acc;
+      if (!isSecret && !readOnly) return acc;
       const localVar = localVariables[key];
       const remoteVar = environmentVariables.find(
         (variable) => variable.key === key
       );
-      if (localVar === remoteVar?.value)
-        return acc;
+      if (localVar === remoteVar?.value) return acc;
       return [...acc, key];
     },
     []
@@ -131,11 +127,9 @@ async function runEnvPush({
 ${outputToken.linesDiff(diff)}
 Continue?`.value
     });
-    if (!confirmPush)
-      return;
+    if (!confirmPush) return;
   }
-  if (!validatedEnvironment.id)
-    throw new AbortError("Missing environment ID");
+  if (!validatedEnvironment.id) throw new AbortError("Missing environment ID");
   const { userErrors } = await pushStorefrontEnvVariables(
     session,
     config.storefront.id,

package/dist/commands/hydrogen/init.d.ts

@@ -2,14 +2,16 @@ import * as _oclif_core_lib_interfaces_parser_js from '@oclif/core/lib/interface
 import Command from '@shopify/cli-kit/node/base-command';
 import { PackageManager } from '@shopify/cli-kit/node/node-package-manager';
 
-declare const ASSETS_STARTER_DIR = "starter";
-type AssetsDir = 'tailwind' | 'css-modules' | 'vanilla-extract' | 'postcss' | 'vite' | 'i18n' | 'routes' | 'bundle' | 'virtual-routes' | 'internal-templates' | 'external-templates' | typeof ASSETS_STARTER_DIR;
-
-type CssStrategy = Extract<AssetsDir, 'tailwind' | 'css-modules' | 'vanilla-extract' | 'postcss'>;
-
+declare const SETUP_I18N_STRATEGIES: readonly ["subfolders", "domains", "subdomains"];
+type I18nStrategy = (typeof SETUP_I18N_STRATEGIES)[number];
 declare const I18N_CHOICES: readonly ["subfolders", "domains", "subdomains", "none"];
 type I18nChoice = (typeof I18N_CHOICES)[number];
 
+declare function getCliCommand(directory?: string, forcePkgManager?: 'npm' | 'pnpm' | 'yarn' | 'bun' | 'unknown'): Promise<"h2" | "yarn shopify hydrogen" | "pnpm shopify hydrogen" | "bun shopify hydrogen" | "npx shopify hydrogen">;
+type CliCommand = Awaited<ReturnType<typeof getCliCommand>>;
+
+type CssStrategy = 'tailwind' | 'css-modules' | 'vanilla-extract' | 'postcss';
+
 declare const STYLING_CHOICES: readonly [...CssStrategy[], "none"];
 type StylingChoice = (typeof STYLING_CHOICES)[number];
 
@@ -45,6 +47,7 @@ declare class Init extends Command {
         'package-manager': _oclif_core_lib_interfaces_parser_js.OptionFlag<string | undefined, _oclif_core_lib_interfaces_parser_js.CustomOptions>;
         shortcut: _oclif_core_lib_interfaces_parser_js.BooleanFlag<boolean>;
         markets: _oclif_core_lib_interfaces_parser_js.OptionFlag<string | undefined, _oclif_core_lib_interfaces_parser_js.CustomOptions>;
+        styling: _oclif_core_lib_interfaces_parser_js.OptionFlag<string | undefined, _oclif_core_lib_interfaces_parser_js.CustomOptions>;
         'mock-shop': _oclif_core_lib_interfaces_parser_js.BooleanFlag<boolean>;
         'install-deps': _oclif_core_lib_interfaces_parser_js.BooleanFlag<boolean>;
         path: _oclif_core_lib_interfaces_parser_js.OptionFlag<string | undefined, _oclif_core_lib_interfaces_parser_js.CustomOptions>;
@@ -57,20 +60,20 @@ declare class Init extends Command {
 declare function runInit({ markets, ...options }?: InitOptions & {
     markets?: InitOptions['i18n'];
 }): Promise<{
-    language?: "ts" | "js" | undefined;
-    packageManager: "unknown" | "yarn" | "npm" | "pnpm" | "bun";
-    cssStrategy?: CssStrategy | undefined;
-    cliCommand: "h2" | "yarn shopify hydrogen" | "pnpm shopify hydrogen" | "bun shopify hydrogen" | "npx shopify hydrogen";
+    language?: "ts" | "js";
+    packageManager: "npm" | "pnpm" | "yarn" | "bun" | "unknown";
+    cssStrategy?: CssStrategy;
+    cliCommand: CliCommand;
     depsInstalled: boolean;
-    depsError?: Error | undefined;
-    i18n?: "subfolders" | "domains" | "subdomains" | undefined;
-    i18nError?: Error | undefined;
-    routes?: Record<string, string | string[]> | undefined;
-    routesError?: Error | undefined;
+    depsError?: Error;
+    i18n?: I18nStrategy;
+    i18nError?: Error;
+    routes?: Record<string, string | string[]>;
+    routesError?: Error;
     location: string;
     name: string;
     directory: string;
-    storefrontTitle?: string | undefined;
+    storefrontTitle?: string;
 } | undefined>;
 
 export { Init as default, runInit };

package/dist/commands/hydrogen/init.js

@@ -1,15 +1,13 @@
 import Command from '@shopify/cli-kit/node/base-command';
-import { packageManagerFromUserAgent } from '@shopify/cli-kit/node/node-package-manager';
 import { Flags } from '@oclif/core';
 import { AbortError } from '@shopify/cli-kit/node/error';
 import { commonFlags, flagsToCamelObject, parseProcessFlags } from '../../lib/flags.js';
-import { checkHydrogenVersion } from '../../lib/check-version.js';
+import { checkCurrentCLIVersion } from '../../lib/check-cli-version.js';
+import { STYLING_CHOICES } from '../../lib/setups/css/index.js';
 import { I18N_CHOICES } from '../../lib/setups/i18n/index.js';
-import { supressNodeExperimentalWarnings, execAsync } from '../../lib/process.js';
+import { supressNodeExperimentalWarnings } from '../../lib/process.js';
 import { setupTemplate } from '../../lib/onboarding/index.js';
 import { LANGUAGES } from '../../lib/onboarding/common.js';
-import { currentProcessIsGlobal, inferPackageManagerForGlobalCLI } from '@shopify/cli-kit/node/is-global';
-import { getPkgJsonPath } from '../../lib/build.js';
 
 const FLAG_MAP = { f: "force" };
 class Init extends Command {
@@ -35,6 +33,7 @@ class Init extends Command {
       description: "Use mock.shop as the data source for the storefront.",
       env: "SHOPIFY_HYDROGEN_FLAG_MOCK_DATA"
     }),
+    ...commonFlags.styling,
     ...commonFlags.markets,
     ...commonFlags.shortcut,
     routes: Flags.boolean({
@@ -80,6 +79,11 @@ async function runInit({
       `Invalid URL structure strategy: ${options.i18n}. Must be one of ${I18N_CHOICES.join(", ")}`
     );
   }
+  if (options.styling && !STYLING_CHOICES.includes(options.styling)) {
+    throw new AbortError(
+      `Invalid styling strategy: ${options.styling}. Must be one of ${STYLING_CHOICES.join(", ")}`
+    );
+  }
   options.git ??= true;
   if (options.quickstart) {
     options.i18n ??= "none";
@@ -89,27 +93,11 @@ async function runInit({
     options.path ??= "./hydrogen-quickstart";
     options.routes ??= true;
     options.shortcut ??= true;
+    options.styling ??= "none";
   }
-  const npmPrefix = (await execAsync("npm prefix -s")).stdout.trim();
-  const isH2 = process.argv[1]?.startsWith(npmPrefix);
-  const isGlobal = currentProcessIsGlobal() && !isH2;
-  const showUpgrade = await checkHydrogenVersion(
-    // Resolving the CLI package from a local directory might fail because
-    // this code could be run from a global dependency (e.g. on `npm create`).
-    // Therefore, pass the known path to the package.json directly from here:
-    await getPkgJsonPath(),
-    isGlobal ? "cli" : "cliHydrogen"
-  );
+  const showUpgrade = await checkCurrentCLIVersion();
   if (showUpgrade) {
-    let packageManager2 = options.packageManager ?? packageManagerFromUserAgent();
-    if (packageManager2 === "unknown" || !packageManager2) {
-      packageManager2 = inferPackageManagerForGlobalCLI();
-    }
-    const globalInstallCommand = packageManager2 === "yarn" ? `yarn global add @shopify/cli` : `${packageManager2} install -g @shopify/cli`;
-    const globalMessage = `Please install the latest Shopify CLI version with \`${globalInstallCommand}\` and try again.`;
-    const localMessage = `Please use the latest version with \`${packageManager2} create @shopify/hydrogen@latest\``;
-    const message = isGlobal ? globalMessage : localMessage;
-    showUpgrade(message);
+    showUpgrade(options.packageManager);
   }
   return setupTemplate(options);
 }

package/dist/commands/hydrogen/link.js

@@ -47,8 +47,7 @@ async function runLink({
     flagStorefront,
     cliCommand
   });
-  if (!linkedStore)
-    return;
+  if (!linkedStore) return;
   renderSuccess({
     body: [{ userInput: linkedStore.title }, "is now linked"],
     nextSteps: [

package/dist/commands/hydrogen/preview.js

@@ -87,10 +87,8 @@ async function runPreview({
 }) {
   if (!process.env.NODE_ENV)
     process.env.NODE_ENV = watch ? "development" : "production";
-  if (verbose)
-    setH2OVerbose();
-  if (!isH2Verbose())
-    muteDevLogs();
+  if (verbose) setH2OVerbose();
+  if (!isH2Verbose()) muteDevLogs();
   let { root, buildPath, buildPathWorkerFile, buildPathClient } = getProjectPaths(directory);
   const isClassicProject = await hasRemixConfigFile(root);
   if (watch && isClassicProject) {
@@ -107,12 +105,12 @@ async function runPreview({
     disableRouteWarning: false,
     lockfileCheck: false,
     sourcemap: true,
+    bundleStats: false,
     useCodegen,
     codegenConfigPath
   };
   const buildProcess = shouldBuild ? isClassicProject ? await runClassicCompilerBuild({
-    ...buildOptions,
-    bundleStats: false
+    ...buildOptions
   }).then(projectBuild.resolve) : await runBuild({
     ...buildOptions,
     watch,

package/dist/commands/hydrogen/setup/css.js

@@ -1,11 +1,11 @@
 import { resolvePath } from '@shopify/cli-kit/node/path';
 import { commonFlags, overrideFlag, flagsToCamelObject } from '../../../lib/flags.js';
 import Command from '@shopify/cli-kit/node/base-command';
-import { renderTasks, renderSuccess } from '@shopify/cli-kit/node/ui';
+import { renderSuccess, renderTasks, renderWarning } from '@shopify/cli-kit/node/ui';
 import { getPackageManager, installNodeModules } from '@shopify/cli-kit/node/node-package-manager';
 import { Args } from '@oclif/core';
-import { hasRemixConfigFile, getRemixConfig } from '../../../lib/remix-config.js';
-import { SETUP_CSS_STRATEGIES, renderCssPrompt, setupCssStrategy, CSS_STRATEGY_NAME_MAP } from '../../../lib/setups/css/index.js';
+import { SETUP_CSS_STRATEGIES, renderCssPrompt, CSS_STRATEGY_NAME_MAP, CSS_STRATEGY_HELP_URL_MAP, setupCssStrategy } from '../../../lib/setups/css/index.js';
+import { getViteConfig } from '../../../lib/vite-config.js';
 import { AbortError } from '@shopify/cli-kit/node/error';
 
 class SetupCSS extends Command {
@@ -39,18 +39,25 @@ async function runSetupCSS({
   force = false,
   installDeps = true
 }) {
-  if (!await hasRemixConfigFile(directory)) {
+  const viteConfig = await getViteConfig(directory).catch(() => null);
+  if (!viteConfig) {
     throw new AbortError(
-      "No remix.config.js file found. This command is not supported in Vite projects."
+      "No Vite config found. This command is only supported in Vite projects."
     );
   }
-  const remixConfigPromise = getRemixConfig(directory);
+  const { remixConfig } = viteConfig;
   const strategy = flagStrategy ? flagStrategy : await renderCssPrompt();
-  const remixConfig = await remixConfigPromise;
-  const setupOutput = await setupCssStrategy(strategy, remixConfig, force);
-  if (!setupOutput)
+  if (strategy === "css-modules" || strategy === "postcss") {
+    renderSuccess({
+      headline: `Vite works out of the box with ${CSS_STRATEGY_NAME_MAP[strategy]}.`,
+      body: `See the Vite documentation for more information:
+${CSS_STRATEGY_HELP_URL_MAP[strategy]}`
+    });
     return;
-  const { workPromise, generatedAssets, helpUrl } = setupOutput;
+  }
+  const setupOutput = await setupCssStrategy(strategy, remixConfig, force);
+  if (!setupOutput) return;
+  const { workPromise, generatedAssets, needsInstallDeps } = setupOutput;
   const tasks = [
     {
       title: "Updating files",
@@ -59,7 +66,8 @@ async function runSetupCSS({
       }
     }
   ];
-  if (installDeps) {
+  let isNpm = false;
+  if (installDeps && needsInstallDeps) {
     const gettingPkgManagerPromise = getPackageManager(
       remixConfig.rootDirectory
     );
@@ -67,6 +75,7 @@ async function runSetupCSS({
       title: "Installing new dependencies",
       task: async () => {
         const packageManager = await gettingPkgManagerPromise;
+        isNpm = packageManager === "npm" || packageManager === "unknown";
         await installNodeModules({
           directory: remixConfig.rootDirectory,
           packageManager,
@@ -79,8 +88,16 @@ async function runSetupCSS({
   renderSuccess({
     headline: `${CSS_STRATEGY_NAME_MAP[strategy]} setup complete.`,
     body: (generatedAssets.length > 0 ? "You can now modify CSS configuration in the following files:\n" + generatedAssets.map((file) => `  - ${file}`).join("\n") + "\n" : "") + `
-For more information, visit ${helpUrl}.`
+For more information, visit ${CSS_STRATEGY_HELP_URL_MAP[strategy]}`
   });
+  if (needsInstallDeps && isNpm && strategy === "tailwind") {
+    renderWarning({
+      body: [
+        "Due to a bug in NPM, you might need to reinstall dependencies again.\nRun",
+        { command: "npm install" }
+      ]
+    });
+  }
 }
 
 export { SetupCSS as default, runSetupCSS };

package/dist/commands/hydrogen/setup/vite.js

@@ -201,8 +201,7 @@ $1$2`
             }
           },
           async (err, nodes) => {
-            if (err)
-              reject(err);
+            if (err) reject(err);
             const nodeMap = {};
             nodes.forEach((node) => {
               if (node.text().endsWith(".module.css")) {
@@ -229,8 +228,7 @@ $1$2`
             resolve(null);
           }
         );
-        if (fileNumber === 0)
-          resolve(null);
+        if (fileNumber === 0) resolve(null);
       });
       await replaceFileContent(rootFilepath, formatOptions, (content) => {
         const root = astGrep.parse(content).root();
@@ -271,8 +269,7 @@ $1$2`
           ...liveReloadElements.reverse(),
           liveReloadImport
         ]) {
-          if (!node)
-            continue;
+          if (!node) continue;
           const { start, end } = node.range();
           content = content.slice(0, start.index) + content.slice(end.index);
         }

package/dist/commands/hydrogen/setup.js

@@ -77,11 +77,13 @@ async function runSetup(options) {
         })
       ])
     ).then(async () => {
-      routes = await setupRoutes(
-        rootDirectory,
-        typescript ? "ts" : "js",
-        i18n
-      );
+      routes = await setupRoutes(rootDirectory, typescript ? "ts" : "js", {
+        i18nStrategy: i18n,
+        // User might have added files before running this command.
+        // We should overwrite them to ensure the routes are set up correctly.
+        // Relies on Git to restore the files if needed.
+        overwriteFileDeps: true
+      });
     });
   }
   if (i18n) {
@@ -95,8 +97,7 @@ async function runSetup(options) {
     cliCommand,
     options.shortcut
   );
-  if (!i18n && !needsRouteGeneration && !createShortcut)
-    return;
+  if (!i18n && !needsRouteGeneration && !createShortcut) return;
   if (createShortcut) {
     backgroundWorkPromise = backgroundWorkPromise.then(async () => {
       if (await createShortcut()) {

package/dist/commands/hydrogen/upgrade.js

@@ -153,8 +153,7 @@ async function getHydrogenVersion({ appPath }) {
   return { currentVersion, currentDependencies };
 }
 async function getChangelog() {
-  if (CACHED_CHANGELOG)
-    return CACHED_CHANGELOG;
+  if (CACHED_CHANGELOG) return CACHED_CHANGELOG;
   if (isHydrogenMonorepo && hydrogenPackagesPath && process.env.FORCE_CHANGELOG_SOURCE !== "remote") {
     const require2 = createRequire(import.meta.url);
     return require2(joinPath(
@@ -189,8 +188,7 @@ function hasOutdatedDependencies({
     ...release.devDependencies
   }).some(([name, version]) => {
     const currentDependencyVersion = currentDependencies?.[name];
-    if (!currentDependencyVersion)
-      return false;
+    if (!currentDependencyVersion) return false;
     const isDependencyOutdated = semver.gt(
       getAbsoluteVersion(version),
       getAbsoluteVersion(currentDependencyVersion)
@@ -204,11 +202,9 @@ function isUpgradeableRelease({
   release
 }) {
   const isHydrogenOutdated = semver.gt(release.version, currentPinnedVersion);
-  if (isHydrogenOutdated)
-    return true;
+  if (isHydrogenOutdated) return true;
   const isCurrentHydrogen = getAbsoluteVersion(release.version) === currentPinnedVersion;
-  if (!isCurrentHydrogen)
-    return false;
+  if (!isCurrentHydrogen) return false;
   return hasOutdatedDependencies({ release, currentDependencies });
 }
 function getAvailableUpgrades({
@@ -224,8 +220,7 @@ function getAvailableUpgrades({
       currentPinnedVersion,
       currentDependencies
     });
-    if (!isUpgradeable)
-      return false;
+    if (!isUpgradeable) return false;
     if (currentMajorVersion !== release.version) {
       currentMajorVersion = release.version;
       return true;
@@ -233,8 +228,7 @@ function getAvailableUpgrades({
     return false;
   });
   const uniqueAvailableUpgrades = availableUpgrades.reduce((acc, release) => {
-    if (acc[release.version])
-      return acc;
+    if (acc[release.version]) return acc;
     acc[release.version] = release;
     return acc;
   }, {});
@@ -262,11 +256,9 @@ function getCummulativeRelease({
   }
   const upgradingReleases = availableUpgrades.filter((release) => {
     const isHydrogenUpgrade = semver.gt(release.version, currentPinnedVersion) && semver.lte(release.version, selectedRelease.version);
-    if (isHydrogenUpgrade)
-      return true;
+    if (isHydrogenUpgrade) return true;
     const isSameHydrogenVersion = getAbsoluteVersion(release.version) === currentPinnedVersion;
-    if (!isSameHydrogenVersion || !currentDependencies)
-      return false;
+    if (!isSameHydrogenVersion || !currentDependencies) return false;
     return hasOutdatedDependencies({ release, currentDependencies });
   });
   return upgradingReleases.reduce(
@@ -330,27 +322,21 @@ function maybeIncludeDependency({
 }) {
   const existingDependencyVersion = currentDependencies[name];
   const isRemixPackage = isRemixDependency([name, version]);
-  if (isRemixPackage)
-    return false;
+  if (isRemixPackage) return false;
   const isNextVersion = existingDependencyVersion === "next";
-  if (isNextVersion)
-    return false;
+  if (isNextVersion) return false;
   const depMeta = selectedRelease.dependenciesMeta?.[name];
-  if (!depMeta)
-    return true;
+  if (!depMeta) return true;
   const isRequired = Boolean(
     selectedRelease.dependenciesMeta?.[name]?.required
   );
-  if (!isRequired)
-    return false;
-  if (!existingDependencyVersion)
-    return true;
+  if (!isRequired) return false;
+  if (!existingDependencyVersion) return true;
   const isOlderVersion = semver.lt(
     getAbsoluteVersion(existingDependencyVersion),
     getAbsoluteVersion(version)
   );
-  if (isOlderVersion)
-    return true;
+  if (isOlderVersion) return true;
   return false;
 }
 function buildUpgradeCommandArgs({
@@ -364,8 +350,7 @@ function buildUpgradeCommandArgs({
       dependency,
       selectedRelease
     });
-    if (!shouldUpgradeDep)
-      continue;
+    if (!shouldUpgradeDep) continue;
     args.push(`${dependency[0]}@${getAbsoluteVersion(dependency[1])}`);
   }
   for (const dependency of Object.entries(selectedRelease.devDependencies)) {
@@ -374,8 +359,7 @@ function buildUpgradeCommandArgs({
       dependency,
       selectedRelease
     });
-    if (!shouldUpgradeDep)
-      continue;
+    if (!shouldUpgradeDep) continue;
     args.push(`${dependency[0]}@${getAbsoluteVersion(dependency[1])}`);
   }
   const currentRemix = Object.entries(currentDependencies).find(isRemixDependency);

package/dist/hooks/init.js

@@ -1,11 +1,41 @@
-import { spawnSync } from 'child_process';
-import { outputDebug } from '@shopify/cli-kit/node/output';
+import { createRequire } from 'node:module';
+import { spawnSync } from 'node:child_process';
+import { outputNewline, outputDebug } from '@shopify/cli-kit/node/output';
+import { cwd, resolvePath, joinPath } from '@shopify/cli-kit/node/path';
+import { renderWarning } from '@shopify/cli-kit/node/ui';
 
-const EXPERIMENTAL_VM_MODULES_FLAG = "--experimental-vm-modules";
-function commandNeedsVM(id = "", argv = []) {
-  return id === "hydrogen:debug:cpu" || ["hydrogen:dev", "hydrogen:preview"].includes(id) && argv.includes("--legacy-runtime");
-}
 const hook = async function(options) {
+  if (!options.id?.startsWith("hydrogen:") || options.id === "hydrogen:init") {
+    return;
+  }
+  let projectPath = cwd();
+  const pathFlagRE = /^--path($|=)/;
+  const pathFlagIndex = options.argv.findIndex((arg) => pathFlagRE.test(arg));
+  if (pathFlagIndex !== -1) {
+    const pathFlagValue = options.argv[pathFlagIndex]?.split("=")[1] ?? options.argv[pathFlagIndex + 1];
+    if (pathFlagValue && !pathFlagValue.startsWith("--")) {
+      projectPath = resolvePath(projectPath, pathFlagValue);
+    }
+  }
+  if (!isHydrogenProject(projectPath)) {
+    outputNewline();
+    renderWarning({
+      headline: `Looks like you're trying to run a Hydrogen command outside of a Hydrogen project.`,
+      body: [
+        "Run",
+        { command: "shopify hydrogen init" },
+        "to create a new Hydrogen project or use the",
+        { command: "--path" },
+        "flag to specify an existing Hydrogen project.\n\n",
+        { subdued: projectPath }
+      ],
+      reference: [
+        "Getting started: https://shopify.dev/docs/storefronts/headless/hydrogen",
+        "CLI commands: https://shopify.dev/docs/api/shopify-cli/hydrogen"
+      ]
+    });
+    process.exit(1);
+  }
   if (commandNeedsVM(options.id, options.argv) && !process.execArgv.includes(EXPERIMENTAL_VM_MODULES_FLAG) && !(process.env.NODE_OPTIONS ?? "").includes(EXPERIMENTAL_VM_MODULES_FLAG)) {
     outputDebug(
       `Restarting CLI process with ${EXPERIMENTAL_VM_MODULES_FLAG} flag.`
@@ -16,6 +46,20 @@ const hook = async function(options) {
     process.exit(result.status ?? 1);
   }
 };
+const EXPERIMENTAL_VM_MODULES_FLAG = "--experimental-vm-modules";
+function commandNeedsVM(id = "", argv = []) {
+  return id === "hydrogen:debug:cpu" || ["hydrogen:dev", "hydrogen:preview"].includes(id) && argv.includes("--legacy-runtime");
+}
+function isHydrogenProject(projectPath) {
+  try {
+    const require2 = createRequire(import.meta.url);
+    const { dependencies } = require2(joinPath(projectPath, "package.json"));
+    return !!dependencies["@shopify/hydrogen"] || // Diff examples only have this package as a dependency
+    !!dependencies["@shopify/cli-hydrogen"];
+  } catch {
+    return false;
+  }
+}
 var init_default = hook;
 
 export { init_default as default };