@shopify/cli-hydrogen 6.0.2 → 7.0.0

package/dist/hooks/init.js

@@ -2,11 +2,11 @@ import { spawnSync } from 'child_process';
 import { outputDebug } from '@shopify/cli-kit/node/output';
 
 const EXPERIMENTAL_VM_MODULES_FLAG = "--experimental-vm-modules";
+function commandNeedsVM(id = "", argv = []) {
+  return "hydrogen:debug:cpu";
+}
 const hook = async function(options) {
-  if (options.id && // All the commands that rely on MiniOxygen:
-  ["hydrogen:dev", "hydrogen:preview", "hydrogen:debug:cpu"].includes(
-    options.id
-  ) && !process.execArgv.includes(EXPERIMENTAL_VM_MODULES_FLAG) && !(process.env.NODE_OPTIONS ?? "").includes(EXPERIMENTAL_VM_MODULES_FLAG)) {
+  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.`
     );

package/dist/lib/auth.js

@@ -8,6 +8,7 @@ import ansiEscapes from 'ansi-escapes';
 import { resetConfig, getConfig, setUserAccount } from './shopify-config.js';
 import { getUserAccount } from './graphql/business-platform/user-account.js';
 import { muteAuthLogs } from './log.js';
+import { deferPromise } from './defer.js';
 
 async function logout(root) {
   await logout$1();
@@ -24,14 +25,11 @@ async function login(root, shop) {
     shop = await normalizeStoreFqdn(shop);
   const hideLoginInfo = showLoginInfo();
   if (!shop || !shopName || !email || forcePrompt || shop !== existingConfig.shop) {
-    const dummyTimeout = setTimeout(() => {
-    }, 6e5);
     const token = await ensureAuthenticatedBusinessPlatform().catch(() => {
       throw new AbortError(
         "Unable to authenticate with Shopify. Please report this issue."
       );
     });
-    clearTimeout(dummyTimeout);
     const userAccount = await getUserAccount(token);
     await hideLoginInfo();
     const preselected = !forcePrompt && shop && userAccount.activeShops.find(({ fqdn }) => shop === fqdn);
@@ -56,10 +54,7 @@ async function login(root, shop) {
   return { session, config };
 }
 function showLoginInfo() {
-  let deferredResolve;
-  const promise = new Promise((resolve) => {
-    deferredResolve = resolve;
-  });
+  const deferred = deferPromise();
   console.log("");
   let hasLoggedTimeout = false;
   let hasLoggedPressKey = false;
@@ -94,21 +89,21 @@ function showLoginInfo() {
           {
             title: "Waiting for Shopify authentication",
             task: async () => {
-              await promise;
+              await deferred.promise;
             }
           }
         ]);
       });
     }
   });
-  promise.then(() => {
+  deferred.promise.then(() => {
     restoreLogs();
     if (hasLoggedPressKey) {
       process.stdout.write(ansiEscapes.eraseLines(hasLoggedTimeout ? 11 : 10));
     }
   });
   return async () => {
-    deferredResolve();
+    deferred.resolve();
     await new Promise((resolve) => setTimeout(resolve, 0));
   };
 }

package/dist/lib/build.js

@@ -1,4 +1,5 @@
 import { fileURLToPath } from 'node:url';
+import { execAsync } from './process.js';
 
 const GENERATOR_TEMPLATES_DIR = "generator-templates";
 const GENERATOR_STARTER_DIR = "starter";
@@ -47,5 +48,9 @@ function getSkeletonSourceDir() {
     new URL(`../../../../templates/skeleton`, import.meta.url)
   );
 }
+async function getRepoNodeModules() {
+  const { stdout } = await execAsync("npm root");
+  return stdout.trim() || fileURLToPath(new URL(`../../../../node_modules`, import.meta.url));
+}
 
-export { GENERATOR_APP_DIR, GENERATOR_ROUTE_DIR, GENERATOR_SETUP_ASSETS_DIR, GENERATOR_SETUP_ASSETS_SUB_DIRS, GENERATOR_STARTER_DIR, GENERATOR_TEMPLATES_DIR, getAssetDir, getSkeletonSourceDir, getStarterDir, getTemplateAppFile };
+export { GENERATOR_APP_DIR, GENERATOR_ROUTE_DIR, GENERATOR_SETUP_ASSETS_DIR, GENERATOR_SETUP_ASSETS_SUB_DIRS, GENERATOR_STARTER_DIR, GENERATOR_TEMPLATES_DIR, getAssetDir, getRepoNodeModules, getSkeletonSourceDir, getStarterDir, getTemplateAppFile };

package/dist/lib/bundle/analyzer.js

@@ -2,30 +2,43 @@ import { joinPath, dirname } from '@shopify/cli-kit/node/path';
 import { fileURLToPath } from 'node:url';
 import { fileExists, readFile, writeFile } from '@shopify/cli-kit/node/fs';
 import colors from '@shopify/cli-kit/node/colors';
+import { renderWarning } from '@shopify/cli-kit/node/ui';
 
-async function hasMetafile(buildPath) {
-  return (await Promise.all([
-    fileExists(joinPath(buildPath, "worker", "metafile.server.json")),
-    fileExists(joinPath(buildPath, "worker", "metafile.js.json"))
-  ])).every(Boolean);
-}
 async function buildBundleAnalysis(buildPath) {
-  await Promise.all([
-    writeBundleAnalyzerFile(
-      buildPath,
-      "metafile.server.json",
-      "worker-bundle-analyzer.html"
-    ),
-    writeBundleAnalyzerFile(
-      buildPath,
-      "metafile.js.json",
-      "client-bundle-analyzer.html"
-    )
-  ]);
-  return "file://" + joinPath(buildPath, "worker", "worker-bundle-analyzer.html");
+  const workerBuildPath = joinPath(buildPath, "worker");
+  const serverMetafile = "metafile.server.json";
+  const clientMetafile = "metafile.js.json";
+  const hasMetafile = (await Promise.all([
+    fileExists(joinPath(workerBuildPath, serverMetafile)),
+    fileExists(joinPath(workerBuildPath, clientMetafile))
+  ])).every(Boolean);
+  if (!hasMetafile)
+    return null;
+  try {
+    await Promise.all([
+      writeBundleAnalyzerFile(
+        workerBuildPath,
+        serverMetafile,
+        "worker-bundle-analyzer.html"
+      ),
+      writeBundleAnalyzerFile(
+        workerBuildPath,
+        clientMetafile,
+        "client-bundle-analyzer.html"
+      )
+    ]);
+    return "file://" + joinPath(workerBuildPath, "worker-bundle-analyzer.html");
+  } catch (thrown) {
+    const error = thrown;
+    renderWarning({
+      headline: "Could not generate bundle analysis",
+      body: error?.stack ?? error?.message ?? error
+    });
+    return null;
+  }
 }
-async function writeBundleAnalyzerFile(buildPath, metafileName, outputFile) {
-  const metafile = await readFile(joinPath(buildPath, "worker", metafileName), {
+async function writeBundleAnalyzerFile(workerBuildPath, metafileName, outputFile) {
+  const metafile = await readFile(joinPath(workerBuildPath, metafileName), {
     encoding: "utf8"
   });
   const metafile64 = Buffer.from(metafile, "utf-8").toString("base64");
@@ -38,10 +51,7 @@ async function writeBundleAnalyzerFile(buildPath, metafileName, outputFile) {
     `globalThis.METAFILE = '';`,
     `globalThis.METAFILE = '${metafile64}';`
   );
-  await writeFile(
-    joinPath(buildPath, "worker", outputFile),
-    templateWithMetafile
-  );
+  await writeFile(joinPath(workerBuildPath, outputFile), templateWithMetafile);
 }
 async function getBundleAnalysisSummary(bundlePath) {
   const esbuild = await import('esbuild').catch(() => {
@@ -59,4 +69,4 @@ async function getBundleAnalysisSummary(bundlePath) {
   }
 }
 
-export { buildBundleAnalysis, getBundleAnalysisSummary, hasMetafile };
+export { buildBundleAnalysis, getBundleAnalysisSummary };

package/dist/lib/check-lockfile.js

@@ -25,6 +25,7 @@ function missingLockfileWarning(shouldExit) {
 }
 function multipleLockfilesWarning(lockfiles2, shouldExit) {
   const packageManagers = {
+    "bun.lockb": "bun",
     "yarn.lock": "yarn",
     "package-lock.json": "npm",
     "pnpm-lock.yaml": "pnpm"

package/dist/lib/codegen.js

@@ -2,7 +2,7 @@ import { spawn } from 'node:child_process';
 import { fileURLToPath } from 'node:url';
 import { getCodeFormatOptions, formatCode } from './format-code.js';
 import { renderWarning, renderFatalError } from '@shopify/cli-kit/node/ui';
-import { relativePath, joinPath } from '@shopify/cli-kit/node/path';
+import { relativePath, joinPath, basename } from '@shopify/cli-kit/node/path';
 import { AbortError } from '@shopify/cli-kit/node/error';
 
 const nodePath = process.argv[1];
@@ -55,6 +55,7 @@ function spawnCodegenProcess({
         type: 0,
         name: "CodegenError",
         message: `Codegen process exited with code ${code}`,
+        skipOclifErrorHandling: true,
         tryMessage: "Try restarting the dev server."
       });
       process.exit(code);
@@ -109,12 +110,35 @@ async function generateTypes({
   });
   codegenContext.cwd = dirs.rootDirectory;
   await generate(codegenContext, true);
-  return Object.keys(codegenConfig.generates);
+  return Object.entries(codegenConfig.generates).reduce((acc, [key, value]) => {
+    if ("documents" in value) {
+      acc[key] = (Array.isArray(value.documents) ? value.documents : [value.documents]).filter((document) => typeof document === "string");
+    }
+    return acc;
+  }, {});
 }
 async function generateDefaultConfig({ rootDirectory, appDirectory }, forceSfapiVersion) {
-  const { schema, preset, pluckConfig } = await import('@shopify/hydrogen-codegen');
+  const { getSchema, preset, pluckConfig } = await import('@shopify/hydrogen-codegen');
+  const { loadConfig } = await import('graphql-config');
+  const gqlConfig = await loadConfig({
+    rootDir: rootDirectory,
+    throwOnEmpty: false,
+    throwOnMissing: false,
+    legacy: false
+  }).catch(() => void 0);
+  const sfapiSchema = getSchema("storefront");
+  const sfapiProject = findGqlProject(sfapiSchema, gqlConfig);
   const defaultGlob = "*!(*.d).{ts,tsx,js,jsx}";
   const appDirRelative = relativePath(rootDirectory, appDirectory);
+  const caapiSchema = getSchema("customer-account");
+  const caapiProject = findGqlProject(caapiSchema, gqlConfig);
+  const customerAccountAPIConfig = caapiProject?.documents ? {
+    ["customer-accountapi.generated.d.ts"]: {
+      preset,
+      schema: caapiSchema,
+      documents: caapiProject?.documents
+    }
+  } : void 0;
   return {
     filepath: "virtual:codegen",
     config: {
@@ -123,8 +147,8 @@ async function generateDefaultConfig({ rootDirectory, appDirectory }, forceSfapi
       generates: {
         ["storefrontapi.generated.d.ts"]: {
           preset,
-          schema,
-          documents: [
+          schema: sfapiSchema,
+          documents: sfapiProject?.documents ?? [
             defaultGlob,
             // E.g. ./server.(t|j)s
             joinPath(appDirRelative, "**", defaultGlob)
@@ -145,24 +169,41 @@ async function generateDefaultConfig({ rootDirectory, appDirectory }, forceSfapi
               scalars: { JSON: "unknown" }
             }
           }
-        }
+        },
+        ...customerAccountAPIConfig
       }
     }
   };
 }
+function findGqlProject(schemaFilepath, gqlConfig) {
+  if (!gqlConfig)
+    return;
+  const schemaFilename = basename(schemaFilepath);
+  return Object.values(gqlConfig.projects || {}).find(
+    (project) => typeof project.schema === "string" && project.schema.endsWith(schemaFilename)
+  );
+}
 async function addHooksToHydrogenOptions(codegenConfig, { rootDirectory }) {
-  const { schema } = await import('@shopify/hydrogen-codegen');
-  const [, options] = Object.entries(codegenConfig.generates).find(
-    ([, value]) => (Array.isArray(value) ? value[0] : value)?.schema === schema
-  ) || [];
-  const hydrogenOptions = Array.isArray(options) ? options[0] : options;
-  if (hydrogenOptions) {
-    const formatConfig = await getCodeFormatOptions(rootDirectory);
-    hydrogenOptions.hooks = {
-      beforeOneFileWrite: (file, content) => formatCode(content, formatConfig, file),
-      // Run Prettier before writing files
-      ...hydrogenOptions.hooks
-    };
+  const hydrogenProjectsOptions = Object.values(codegenConfig.generates).filter(
+    (value) => {
+      const foundPreset = (Array.isArray(value) ? value[0] : value)?.preset;
+      if (typeof foundPreset === "object") {
+        const name = Symbol.for("name");
+        if (name in foundPreset) {
+          return foundPreset[name] === "hydrogen";
+        }
+      }
+    }
+  );
+  for (const options of hydrogenProjectsOptions) {
+    const hydrogenOptions = Array.isArray(options) ? options[0] : options;
+    if (hydrogenOptions) {
+      const formatConfig = await getCodeFormatOptions(rootDirectory);
+      hydrogenOptions.hooks = {
+        beforeOneFileWrite: (file, content) => formatCode(content, formatConfig, file),
+        ...hydrogenOptions.hooks
+      };
+    }
   }
 }
 

package/dist/lib/defer.js

@@ -0,0 +1,12 @@
+function deferPromise() {
+  let resolve = (value) => {
+  };
+  let reject = resolve;
+  const promise = new Promise((_resolve, _reject) => {
+    resolve = _resolve;
+    reject = _reject;
+  });
+  return { promise, resolve, reject };
+}
+
+export { deferPromise };

package/dist/lib/file.js

@@ -1,6 +1,7 @@
-import { resolvePath } from '@shopify/cli-kit/node/path';
+import { readdir } from 'node:fs/promises';
+import { resolvePath, joinPath } from '@shopify/cli-kit/node/path';
 import { readFile, writeFile, isDirectory, fileExists } from '@shopify/cli-kit/node/fs';
-import { readdir } from 'fs/promises';
+import { readAndParsePackageJson, writePackageJSON } from '@shopify/cli-kit/node/node-package-manager';
 import { formatCode } from './format-code.js';
 
 async function replaceFileContent(filepath, formatConfig, replacer) {
@@ -37,5 +38,53 @@ async function findFileWithExtension(directory, fileBase, extensions = DEFAULT_E
   }
   return {};
 }
+const MANAGED_PACKAGE_JSON_KEYS = Object.freeze([
+  "dependencies",
+  "devDependencies",
+  "peerDependencies"
+]);
+async function mergePackageJson(sourceDir, targetDir, options) {
+  const targetPkgJson = await readAndParsePackageJson(
+    joinPath(targetDir, "package.json")
+  );
+  const sourcePkgJson = await readAndParsePackageJson(
+    joinPath(sourceDir, "package.json")
+  );
+  const ignoredKeys = /* @__PURE__ */ new Set(["comment", ...options?.ignoredKeys ?? []]);
+  const unmanagedKeys = Object.keys(sourcePkgJson).filter(
+    (key) => !MANAGED_PACKAGE_JSON_KEYS.includes(key)
+  );
+  for (const key of unmanagedKeys) {
+    if (ignoredKeys.has(key))
+      continue;
+    const sourceValue = sourcePkgJson[key];
+    const targetValue = targetPkgJson[key];
+    const newValue = Array.isArray(sourceValue) && Array.isArray(targetValue) ? [...targetValue, ...sourceValue] : typeof sourceValue === "object" && typeof targetValue === "object" ? { ...targetValue, ...sourceValue } : sourceValue;
+    targetPkgJson[key] = newValue;
+  }
+  const remixVersion = Object.entries(targetPkgJson.dependencies || {}).find(
+    ([dep]) => dep.startsWith("@remix-run/")
+  )?.[1];
+  for (const key of MANAGED_PACKAGE_JSON_KEYS) {
+    if (ignoredKeys.has(key))
+      continue;
+    if (sourcePkgJson[key]) {
+      targetPkgJson[key] = [
+        .../* @__PURE__ */ new Set([
+          ...Object.keys(targetPkgJson[key] ?? {}),
+          ...Object.keys(sourcePkgJson[key] ?? {})
+        ])
+      ].sort().reduce((acc, dep) => {
+        let version = sourcePkgJson[key]?.[dep] ?? targetPkgJson[key]?.[dep];
+        if (dep.startsWith("@remix-run/") && remixVersion) {
+          version = remixVersion;
+        }
+        acc[dep] = version;
+        return acc;
+      }, {});
+    }
+  }
+  await writePackageJSON(targetDir, targetPkgJson);
+}
 
-export { findFileWithExtension, replaceFileContent };
+export { findFileWithExtension, mergePackageJson, replaceFileContent };

package/dist/lib/flags.js

@@ -5,6 +5,7 @@ import { normalizeStoreFqdn } from '@shopify/cli-kit/node/context/fqdn';
 import colors from '@shopify/cli-kit/node/colors';
 import { STYLING_CHOICES } from './setups/css/index.js';
 import { I18N_CHOICES } from './setups/i18n/index.js';
+import { DEFAULT_INSPECTOR_PORT } from './mini-oxygen/common.js';
 
 const DEFAULT_PORT = 3e3;
 const commonFlags = {
@@ -17,9 +18,9 @@ const commonFlags = {
     env: "SHOPIFY_HYDROGEN_FLAG_PORT",
     default: DEFAULT_PORT
   }),
-  workerRuntime: Flags.boolean({
-    description: "Run the app in a worker environment closer to Oxygen production instead of a Node.js sandbox. This flag is unstable and may change without notice.",
-    env: "SHOPIFY_HYDROGEN_FLAG_WORKER_UNSTABLE"
+  legacyRuntime: Flags.boolean({
+    description: "Run the app in a Node.js sandbox instead of an Oxygen worker.",
+    env: "SHOPIFY_HYDROGEN_FLAG_WORKER"
   }),
   force: Flags.boolean({
     description: "Overwrite the destination directory and files if they already exist.",
@@ -51,9 +52,7 @@ const commonFlags = {
   codegen: Flags.boolean({
     description: "Generate types for the Storefront API queries found in your project.",
     required: false,
-    default: false,
-    deprecateAliases: true,
-    aliases: ["codegen-unstable"]
+    default: false
   }),
   codegenConfigPath: Flags.string({
     description: "Specify a path to a codegen configuration file. Defaults to `<root>/codegen.ts` if it exists.",
@@ -78,6 +77,21 @@ const commonFlags = {
     description: "Create a shortcut to the Shopify Hydrogen CLI.",
     env: "SHOPIFY_HYDROGEN_FLAG_SHORTCUT",
     allowNo: true
+  }),
+  debug: Flags.boolean({
+    description: "Enables inspector connections with a debugger.",
+    env: "SHOPIFY_HYDROGEN_FLAG_DEBUG",
+    default: false
+  }),
+  inspectorPort: Flags.integer({
+    description: "Port where the inspector will be available.",
+    env: "SHOPIFY_HYDROGEN_FLAG_INSPECTOR_PORT",
+    default: DEFAULT_INSPECTOR_PORT
+  }),
+  diff: Flags.boolean({
+    description: "Applies the current files on top of Hydrogen's starter template in a temporary directory.",
+    default: false,
+    required: false
   })
 };
 function flagsToCamelObject(obj) {
@@ -104,18 +118,22 @@ function parseProcessFlags(processArgv, flagMap = {}) {
   }
   return flagsToCamelObject(options);
 }
-function deprecated(name) {
-  return Flags.custom({
+function deprecated(name, { isBoolean = false } = {}) {
+  const customFlag = Flags.custom({
     parse: () => {
       renderInfo({
         headline: `The ${colors.bold(
           name
-        )} flag is deprecated and will be removed in a future version of Shopify CLI.`
+        )} flag is deprecated and will be removed in a future version of Shopify Hydrogen CLI.`
       });
       return Promise.resolve(" ");
     },
     hidden: true
   });
+  return {
+    ...customFlag(),
+    type: isBoolean ? "boolean" : "option"
+  };
 }
 function overrideFlag(flag, extra) {
   return {

package/dist/lib/get-oxygen-deployment-data.test.js

@@ -25,11 +25,13 @@ describe("getOxygenDeploymentData", () => {
   const environments = [
     {
       name: "production",
-      branch: "main"
+      branch: "main",
+      type: "PRODUCTION"
     },
     {
       name: "preview",
-      branch: "staging"
+      branch: null,
+      type: "PREVIEW"
     }
   ];
   beforeEach(() => {

package/dist/lib/graphql/admin/client.test.js

@@ -14,7 +14,7 @@ describe("adminRequest", () => {
       token: "",
       storeFqdn: ""
     });
-    expect(response).toContain(fakeResponse);
+    expect(response).toMatchObject(fakeResponse);
   });
   describe("when there is an unknown error response", () => {
     it("passes along the error message", async () => {
@@ -30,7 +30,7 @@ describe("adminRequest", () => {
         token: "",
         storeFqdn: ""
       });
-      await expect(response).rejects.toContain(fakeGraphqlError);
+      await expect(response).rejects.toMatchObject(fakeGraphqlError);
     });
   });
   describe("when the app isn't installed", () => {

package/dist/lib/graphql/admin/get-oxygen-data.js

@@ -7,6 +7,7 @@ const GetDeploymentDataQuery = `#graphql
       environments {
         name
         branch
+        type
       }
     }
   }

package/dist/lib/log.js

@@ -32,6 +32,10 @@ function debounceMessage(args, debounceFor) {
   }
   return false;
 }
+function warningDebouncer([first]) {
+  return typeof first === "string" && // Show these warnings only once.
+  (first.includes("[h2:warn:createStorefrontClient]") || first.includes("[h2:warn:createCustomerAccountClient]")) ? true : void 0;
+}
 function injectLogReplacer(method, debouncer) {
   if (!methodsReplaced.has(method)) {
     methodsReplaced.add(method);
@@ -57,7 +61,7 @@ function injectLogReplacer(method, debouncer) {
 function muteDevLogs({ workerReload } = {}) {
   injectLogReplacer("log");
   injectLogReplacer("error");
-  injectLogReplacer("warn");
+  injectLogReplacer("warn", warningDebouncer);
   let isFirstWorkerReload = true;
   addMessageReplacers("dev-node", [
     ([first]) => typeof first === "string" && first.includes("[mf:"),
@@ -77,18 +81,30 @@ function muteDevLogs({ workerReload } = {}) {
   ]);
   addMessageReplacers(
     "dev-workerd",
+    // Workerd logs
+    [
+      ([first]) => typeof first === "string" && /^\x1B\[31m(workerd\/|stack:( (0|[a-f\d]{4,})){3,})/.test(first),
+      () => {
+      }
+    ],
     [
-      // Workerd logs
-      ([first]) => typeof first === "string" && /^\x1B\[31m(workerd\/|stack:)/.test(first),
+      ([first]) => typeof first === "string" && /\$LLVM_SYMBOLIZER|recursive isolate lock/.test(first),
       () => {
       }
     ],
-    // Non-actionable warnings/errors:
+    // Non-actionable warnings:
     [
       ([first]) => typeof first === "string" && /^A promise rejection/i.test(first),
       () => {
       }
     ],
+    [
+      ([first]) => typeof first === "string" && /resolved to multiple addresses/i.test(first),
+      // For win32
+      () => {
+      }
+    ],
+    // Non-actionable errors:
     [
       ([first]) => {
         const message = first?.message ?? first;
@@ -157,13 +173,7 @@ function muteAuthLogs({
 }
 function enhanceH2Logs(options) {
   injectLogReplacer("error");
-  injectLogReplacer(
-    "warn",
-    ([first]) => (
-      // Show createStorefrontClient warnings only once.
-      first?.includes?.("[h2:warn:createStorefrontClient]") ? true : void 0
-    )
-  );
+  injectLogReplacer("warn", warningDebouncer);
   addMessageReplacers("h2-warn", [
     ([first]) => {
       const message = first?.message ?? first;
@@ -182,10 +192,11 @@ function enhanceH2Logs(options) {
       const lines = message.split("\n");
       const lastLine = lines.at(-1) ?? "";
       const hasLinks = /https?:\/\//.test(lastLine);
-      if (hasLinks)
+      const hasCommands = /`h2 [^`]+`/.test(lastLine);
+      if (hasLinks || hasCommands)
         lines.pop();
       if (type === "error" || errorObject) {
-        let tryMessage = hasLinks ? lastLine : void 0;
+        let tryMessage = hasLinks || hasCommands ? lastLine : void 0;
         let stack = errorObject?.stack;
         let cause = errorObject?.cause;
         if (typeof cause === "string") {
@@ -235,7 +246,13 @@ function enhanceH2Logs(options) {
       const render = type === "warn" ? renderWarning : renderInfo;
       render({
         body: headline + colors.bold(lines.join("\n")),
-        reference
+        reference,
+        nextSteps: hasCommands ? [
+          lastLine.replace(
+            /`h2 [^`]+`/g,
+            (cmd) => colors.bold(colors.yellow(cmd))
+          )
+        ] : void 0
       });
       return;
     }
@@ -266,6 +283,7 @@ function createRemixLogger() {
         name: "error",
         type: 0,
         message: buildMessageBody(message, options?.details),
+        skipOclifErrorHandling: true,
         tryMessage: ""
       });
     }