@shopify/cli-hydrogen 4.0.8 → 4.1.0

package/dist/generator-templates/routes/policies/$policyHandle.tsx

@@ -1,21 +1,31 @@
-import {json, type MetaFunction, type LoaderArgs} from '@shopify/remix-oxygen';
-import {useLoaderData} from '@remix-run/react';
+import {
+  json,
+  type MetaFunction,
+  type LoaderArgs,
+  type ErrorBoundaryComponent,
+} from '@shopify/remix-oxygen';
+import {
+  useLoaderData,
+  type V2_MetaFunction,
+  useCatch,
+  useRouteError,
+  isRouteErrorResponse,
+} from '@remix-run/react';
+import {Shop} from '@shopify/hydrogen/storefront-api-types';
 
-import {ShopPolicy} from '@shopify/hydrogen/storefront-api-types';
-
-export async function loader({request, params, context}: LoaderArgs) {
+export async function loader({params, context}: LoaderArgs) {
   const handle = params.policyHandle;
 
   if (!handle) {
-    throw new Response(null, {status: 404});
+    throw new Response('No handle was passed in', {status: 404});
   }
 
   const policyName = handle.replace(/-([a-z])/g, (_: unknown, m1: string) =>
     m1.toUpperCase(),
-  );
+  ) as SelectedPolicies;
 
   const data = await context.storefront.query<{
-    shop: Record<string, ShopPolicy>;
+    shop: Pick<Shop, SelectedPolicies>;
   }>(POLICY_CONTENT_QUERY, {
     variables: {
       privacyPolicy: false,
@@ -30,16 +40,20 @@ export async function loader({request, params, context}: LoaderArgs) {
   const policy = data.shop?.[policyName];
 
   if (!policy) {
-    throw new Response(null, {status: 404});
+    throw new Response('Could not find the policy', {status: 404});
   }
 
   return json({policy});
 }
 
-export const meta: MetaFunction<typeof loader> = ({data}) => {
-  return {
-    title: data?.policy?.title ?? 'Policies',
-  };
+export const metaV1: MetaFunction<typeof loader> = ({data}) => {
+  const title = data?.policy?.title ?? 'Policies';
+  return {title};
+};
+
+export const meta: V2_MetaFunction<typeof loader> = ({data}) => {
+  const title = data?.policy?.title ?? 'Policies';
+  return [{title}];
 };
 
 export default function Policies() {
@@ -53,6 +67,36 @@ export default function Policies() {
   );
 }
 
+export const ErrorBoundaryV1: ErrorBoundaryComponent = ({error}) => {
+  console.error(error);
+
+  return <div>There was an error.</div>;
+};
+
+export function CatchBoundary() {
+  const caught = useCatch();
+  console.error(caught);
+
+  return (
+    <div>
+      There was an error. Status: {caught.status}. Message:{' '}
+      {caught.data?.message}
+    </div>
+  );
+}
+
+export function ErrorBoundary() {
+  const error = useRouteError();
+
+  if (isRouteErrorResponse(error)) {
+    console.error(error.status, error.statusText, error.data);
+    return <div>Route Error</div>;
+  } else {
+    console.error((error as Error).message);
+    return <div>Thrown Error</div>;
+  }
+}
+
 const POLICY_CONTENT_QUERY = `#graphql
   fragment Policy on ShopPolicy {
     body
@@ -62,7 +106,7 @@ const POLICY_CONTENT_QUERY = `#graphql
     url
   }
 
-  query PoliciesQuery(
+  query policy_query(
     $language: LanguageCode
     $privacyPolicy: Boolean!
     $shippingPolicy: Boolean!
@@ -85,3 +129,12 @@ const POLICY_CONTENT_QUERY = `#graphql
     }
   }
 `;
+
+const policies = [
+  'privacyPolicy',
+  'shippingPolicy',
+  'refundPolicy',
+  'termsOfService',
+] as const;
+
+type SelectedPolicies = (typeof policies)[number];

package/dist/generator-templates/routes/policies/index.tsx

@@ -1,10 +1,20 @@
-import {json, type LoaderArgs} from '@shopify/remix-oxygen';
-import {useLoaderData, Link} from '@remix-run/react';
-import type {ShopPolicy} from '@shopify/hydrogen/storefront-api-types';
+import {
+  json,
+  type LoaderArgs,
+  type ErrorBoundaryComponent,
+} from '@shopify/remix-oxygen';
+import {
+  useLoaderData,
+  Link,
+  useCatch,
+  useRouteError,
+  isRouteErrorResponse,
+} from '@remix-run/react';
+import type {Shop} from '@shopify/hydrogen/storefront-api-types';
 
 export async function loader({context: {storefront}}: LoaderArgs) {
   const data = await storefront.query<{
-    shop: Record<string, ShopPolicy>;
+    shop: Pick<Shop, SelectedPolicies>;
   }>(POLICIES_QUERY);
 
   const policies = Object.values(data.shop || {});
@@ -36,6 +46,36 @@ export default function Policies() {
   );
 }
 
+export const ErrorBoundaryV1: ErrorBoundaryComponent = ({error}) => {
+  console.error(error);
+
+  return <div>There was an error.</div>;
+};
+
+export function CatchBoundary() {
+  const caught = useCatch();
+  console.error(caught);
+
+  return (
+    <div>
+      There was an error. Status: {caught.status}. Message:{' '}
+      {caught.data?.message}
+    </div>
+  );
+}
+
+export function ErrorBoundary() {
+  const error = useRouteError();
+
+  if (isRouteErrorResponse(error)) {
+    console.error(error.status, error.statusText, error.data);
+    return <div>Route Error</div>;
+  } else {
+    console.error((error as Error).message);
+    return <div>Thrown Error</div>;
+  }
+}
+
 const POLICIES_QUERY = `#graphql
   fragment Policy on ShopPolicy {
     id
@@ -65,3 +105,13 @@ const POLICIES_QUERY = `#graphql
     }
   }
 `;
+
+const policies = [
+  'privacyPolicy',
+  'shippingPolicy',
+  'refundPolicy',
+  'termsOfService',
+  'subscriptionPolicy',
+] as const;
+
+type SelectedPolicies = (typeof policies)[number];

package/dist/generator-templates/routes/products/$productHandle.tsx

@@ -1,15 +1,21 @@
-import {defer, type LoaderArgs} from '@shopify/remix-oxygen';
-import {useLoaderData} from '@remix-run/react';
-import type {
-  ProductVariant,
-  Product as ProductType,
-} from '@shopify/hydrogen/storefront-api-types';
+import {
+  defer,
+  type LoaderArgs,
+  type ErrorBoundaryComponent,
+} from '@shopify/remix-oxygen';
+import {
+  useLoaderData,
+  useCatch,
+  useRouteError,
+  isRouteErrorResponse,
+} from '@remix-run/react';
+import type {Product as ProductType} from '@shopify/hydrogen/storefront-api-types';
 
 export async function loader({params, context}: LoaderArgs) {
   const {productHandle} = params;
 
   const {product} = await context.storefront.query<{
-    product: ProductType & {selectedVariant?: ProductVariant};
+    product: Pick<ProductType, 'id' | 'title' | 'descriptionHtml' | 'vendor'>;
   }>(PRODUCT_QUERY, {
     variables: {
       handle: productHandle,
@@ -40,9 +46,38 @@ export default function Product() {
   );
 }
 
-const PRODUCT_QUERY = `#graphql
+export const ErrorBoundaryV1: ErrorBoundaryComponent = ({error}) => {
+  console.error(error);
+
+  return <div>There was an error.</div>;
+};
+
+export function CatchBoundary() {
+  const caught = useCatch();
+  console.error(caught);
+
+  return (
+    <div>
+      There was an error. Status: {caught.status}. Message:{' '}
+      {caught.data?.message}
+    </div>
+  );
+}
+
+export function ErrorBoundary() {
+  const error = useRouteError();
+
+  if (isRouteErrorResponse(error)) {
+    console.error(error.status, error.statusText, error.data);
+    return <div>Route Error</div>;
+  } else {
+    console.error((error as Error).message);
+    return <div>Thrown Error</div>;
+  }
+}
 
-  query Product(
+const PRODUCT_QUERY = `#graphql
+  query product_query(
     $country: CountryCode
     $language: LanguageCode
     $handle: String!

package/dist/hooks/init.js

@@ -1,10 +1,10 @@
 import { spawnSync } from 'child_process';
-import { output } from '@shopify/cli-kit';
+import { outputDebug } from '@shopify/cli-kit/node/output';
 
 const EXPERIMENTAL_VM_MODULES_FLAG = "--experimental-vm-modules";
 const hook = async function(options) {
   if (options.id && ["hydrogen:dev", "hydrogen:preview"].includes(options.id) && !process.execArgv.includes(EXPERIMENTAL_VM_MODULES_FLAG) && !(process.env.NODE_OPTIONS ?? "").includes(EXPERIMENTAL_VM_MODULES_FLAG)) {
-    output.debug(
+    outputDebug(
       `Restarting CLI process with ${EXPERIMENTAL_VM_MODULES_FLAG} flag.`
     );
     const [command, ...args] = process.argv;

package/dist/{utils → lib}/check-lockfile.js

@@ -1,4 +1,6 @@
-import { file, path, git } from '@shopify/cli-kit';
+import { fileExists } from '@shopify/cli-kit/node/fs';
+import { resolvePath } from '@shopify/cli-kit/node/path';
+import { checkIfIgnoredInGitRepository } from '@shopify/cli-kit/node/git';
 import { renderWarning } from '@shopify/cli-kit/node/ui';
 import { lockfiles } from '@shopify/cli-kit/node/node-package-manager';
 
@@ -54,7 +56,7 @@ async function checkLockfileStatus(directory) {
     return;
   const availableLockfiles = [];
   for (const lockFileName of lockfiles) {
-    if (await file.exists(path.resolve(directory, lockFileName))) {
+    if (await fileExists(resolvePath(directory, lockFileName))) {
       availableLockfiles.push(lockFileName);
     }
   }
@@ -65,9 +67,10 @@ async function checkLockfileStatus(directory) {
     return multipleLockfilesWarning(availableLockfiles);
   }
   try {
-    const repo = git.factory(directory);
     const lockfile = availableLockfiles[0];
-    const ignoredLockfile = await repo.checkIgnore([lockfile]);
+    const ignoredLockfile = await checkIfIgnoredInGitRepository(directory, [
+      lockfile
+    ]);
     if (ignoredLockfile.length) {
       lockfileIgnoredWarning(lockfile);
     }

package/dist/{utils → lib}/check-lockfile.test.js

@@ -1,34 +1,28 @@
 import { checkLockfileStatus } from './check-lockfile.js';
-import { vi, describe, beforeEach, afterEach, it, expect } from 'vitest';
-import { git, outputMocker, file, path } from '@shopify/cli-kit';
+import { describe, vi, beforeEach, afterEach, it, expect } from 'vitest';
+import { inTemporaryDirectory, writeFile } from '@shopify/cli-kit/node/fs';
+import { joinPath } from '@shopify/cli-kit/node/path';
+import { checkIfIgnoredInGitRepository } from '@shopify/cli-kit/node/git';
+import { mockAndCaptureOutput } from '@shopify/cli-kit/node/testing/output';
 
-vi.mock("@shopify/cli-kit", async () => {
-  const cliKit = await vi.importActual("@shopify/cli-kit");
-  return {
-    ...cliKit,
-    git: {
-      factory: vi.fn()
-    }
-  };
-});
 describe("checkLockfileStatus()", () => {
   const checkIgnoreMock = vi.fn();
-  const gitFactoryMock = {
-    checkIgnore: checkIgnoreMock
-  };
+  const outputMock = mockAndCaptureOutput();
   beforeEach(() => {
-    vi.mocked(git.factory).mockReturnValue(gitFactoryMock);
+    vi.mock("@shopify/cli-kit/node/git");
+    vi.mocked(checkIfIgnoredInGitRepository).mockImplementation(
+      checkIgnoreMock
+    );
     vi.mocked(checkIgnoreMock).mockResolvedValue([]);
   });
   afterEach(() => {
     vi.restoreAllMocks();
-    outputMocker.mockAndCaptureOutput().clear();
+    outputMock.clear();
   });
   describe("when a lockfile is present", () => {
     it("does not call displayLockfileWarning", async () => {
-      await file.inTemporaryDirectory(async (tmpDir) => {
-        await file.write(path.join(tmpDir, "package-lock.json"), "");
-        const outputMock = outputMocker.mockAndCaptureOutput();
+      await inTemporaryDirectory(async (tmpDir) => {
+        await writeFile(joinPath(tmpDir, "package-lock.json"), "");
         await checkLockfileStatus(tmpDir);
         expect(outputMock.warn()).toBe("");
       });
@@ -38,9 +32,8 @@ describe("checkLockfileStatus()", () => {
         vi.mocked(checkIgnoreMock).mockResolvedValue(["package-lock.json"]);
       });
       it("renders a warning", async () => {
-        await file.inTemporaryDirectory(async (tmpDir) => {
-          await file.write(path.join(tmpDir, "package-lock.json"), "");
-          const outputMock = outputMocker.mockAndCaptureOutput();
+        await inTemporaryDirectory(async (tmpDir) => {
+          await writeFile(joinPath(tmpDir, "package-lock.json"), "");
           await checkLockfileStatus(tmpDir);
           expect(outputMock.warn()).toMatch(
             / warning .+ Lockfile ignored by Git .+/is
@@ -51,10 +44,9 @@ describe("checkLockfileStatus()", () => {
   });
   describe("when there are multiple lockfiles", () => {
     it("renders a warning", async () => {
-      await file.inTemporaryDirectory(async (tmpDir) => {
-        await file.write(path.join(tmpDir, "package-lock.json"), "");
-        await file.write(path.join(tmpDir, "pnpm-lock.yaml"), "");
-        const outputMock = outputMocker.mockAndCaptureOutput();
+      await inTemporaryDirectory(async (tmpDir) => {
+        await writeFile(joinPath(tmpDir, "package-lock.json"), "");
+        await writeFile(joinPath(tmpDir, "pnpm-lock.yaml"), "");
         await checkLockfileStatus(tmpDir);
         expect(outputMock.warn()).toMatch(
           / warning .+ Multiple lockfiles found .+/is
@@ -64,8 +56,7 @@ describe("checkLockfileStatus()", () => {
   });
   describe("when a lockfile is missing", () => {
     it("renders a warning", async () => {
-      await file.inTemporaryDirectory(async (tmpDir) => {
-        const outputMock = outputMocker.mockAndCaptureOutput();
+      await inTemporaryDirectory(async (tmpDir) => {
         await checkLockfileStatus(tmpDir);
         expect(outputMock.warn()).toMatch(/ warning .+ No lockfile found .+/is);
       });

package/dist/{utils → lib}/check-version.test.js

@@ -1,6 +1,6 @@
 import { checkHydrogenVersion } from './check-version.js';
 import { vi, describe, afterEach, it, expect, beforeEach } from 'vitest';
-import { outputMocker } from '@shopify/cli-kit';
+import { mockAndCaptureOutput } from '@shopify/cli-kit/node/testing/output';
 import { checkForNewVersion } from '@shopify/cli-kit/node/node-package-manager';
 
 vi.mock("@shopify/cli-kit/node/node-package-manager", () => {
@@ -9,8 +9,10 @@ vi.mock("@shopify/cli-kit/node/node-package-manager", () => {
   };
 });
 describe("checkHydrogenVersion()", () => {
+  const outputMock = mockAndCaptureOutput();
   afterEach(() => {
     vi.restoreAllMocks();
+    outputMock.clear();
   });
   describe("when a current version is available", () => {
     it("calls checkForNewVersion", async () => {
@@ -36,7 +38,6 @@ describe("checkHydrogenVersion()", () => {
         expect(await checkHydrogenVersion("dir")).toBeInstanceOf(Function);
       });
       it("outputs a message to the user with the new version", async () => {
-        const outputMock = outputMocker.mockAndCaptureOutput();
         const showUpgrade = await checkHydrogenVersion("dir");
         const { currentVersion, newVersion } = showUpgrade();
         expect(outputMock.info()).toMatch(

package/dist/lib/colors.d.ts

@@ -0,0 +1,8 @@
+import ansiColors from 'ansi-colors';
+
+declare const colors: {
+    dim: ansiColors.StyleFunction;
+    bold: ansiColors.StyleFunction;
+};
+
+export { colors };

package/dist/lib/colors.js

@@ -0,0 +1,8 @@
+import ansiColors from 'ansi-colors';
+
+const colors = {
+  dim: ansiColors.dim,
+  bold: ansiColors.bold
+};
+
+export { colors };

package/dist/{utils → lib}/config.js

@@ -1,6 +1,6 @@
 import { renderFatalError } from '@shopify/cli-kit/node/ui';
-import { output, file } from '@shopify/cli-kit';
-import { createRequire } from 'module';
+import { outputWarn } from '@shopify/cli-kit/node/output';
+import { fileExists } from '@shopify/cli-kit/node/fs';
 import { fileURLToPath } from 'url';
 import path from 'path';
 import fs from 'fs/promises';
@@ -8,6 +8,7 @@ import fs from 'fs/promises';
 const BUILD_DIR = "dist";
 const CLIENT_SUBDIR = "client";
 const WORKER_SUBDIR = "worker";
+const oxygenServerMainFields = ["browser", "module", "main"];
 function getProjectPaths(appPath, entry) {
   const root = appPath ?? process.cwd();
   const publicPath = path.join(root, "public");
@@ -25,13 +26,6 @@ function getProjectPaths(appPath, entry) {
 async function getRemixConfig(root, mode = process.env.NODE_ENV) {
   const { readConfig } = await import('@remix-run/dev/dist/config.js');
   const config = await readConfig(root, mode);
-  if (!config.serverConditions) {
-    const require2 = createRequire(import.meta.url);
-    const actualConfigFile = require2(path.join(root, "remix.config"));
-    config.serverBuildTarget = "cloudflare-workers";
-    config.serverConditions = actualConfigFile.serverConditions;
-    config.serverMainFields = actualConfigFile.serverMainFields;
-  }
   if (!config.serverEntryPoint) {
     throwConfigError(
       "Could not find a server entry point.",
@@ -61,17 +55,14 @@ async function getRemixConfig(root, mode = process.env.NODE_ENV) {
     );
   }
   if (process.env.NODE_ENV === "development" && !config.serverConditions?.includes("development")) {
-    output.warn(
+    outputWarn(
       "Add `process.env.NODE_ENV` value to serverConditions in remix.config.js to enable debugging features in development."
     );
   }
-  const expectedServerMainFields = ["browser", "module", "main"];
-  if (!config.serverMainFields || !expectedServerMainFields.every(
-    (v, i) => config.serverMainFields?.[i] === v
-  )) {
+  if (!config.serverMainFields || !oxygenServerMainFields.every((v, i) => config.serverMainFields?.[i] === v)) {
     throwConfigError(
       `The serverMainFields in remix.config.js must be ${JSON.stringify(
-        expectedServerMainFields
+        oxygenServerMainFields
       )}.`
     );
   }
@@ -104,7 +95,7 @@ async function getRemixConfig(root, mode = process.env.NODE_ENV) {
     config.watchPaths ??= [];
     config.watchPaths.push(
       ...(await fs.readdir(packagesPath)).map(
-        (pkg) => path.resolve(packagesPath, pkg, "dist", "development", "index.js")
+        (pkg) => pkg === "hydrogen-react" ? path.resolve(packagesPath, pkg, "dist", "browser-dev", "index.mjs") : path.resolve(packagesPath, pkg, "dist", "development", "index.js")
       )
     );
     config.watchPaths.push(
@@ -124,13 +115,13 @@ function throwConfigError(message, tryMessage = null) {
 }
 async function assertEntryFileExists(root, fileRelative) {
   const fileAbsolute = path.resolve(root, fileRelative);
-  const exists = await file.exists(fileAbsolute);
+  const exists = await fileExists(fileAbsolute);
   if (!exists) {
     if (!path.extname(fileAbsolute)) {
       const { readdir } = await import('fs/promises');
       const files = await readdir(path.dirname(fileAbsolute));
-      const exists2 = files.some((file2) => {
-        const { name, ext } = path.parse(file2);
+      const exists2 = files.some((file) => {
+        const { name, ext } = path.parse(file);
         return name === path.basename(fileAbsolute) && /^\.[jt]s$/.test(ext);
       });
       if (exists2)

package/dist/{utils → lib}/flags.d.ts

@@ -1,8 +1,8 @@
 import * as _oclif_core_lib_interfaces_parser_js from '@oclif/core/lib/interfaces/parser.js';
 
 declare const commonFlags: {
-    path: _oclif_core_lib_interfaces_parser_js.OptionFlag<string | undefined>;
-    port: _oclif_core_lib_interfaces_parser_js.OptionFlag<number>;
+    path: _oclif_core_lib_interfaces_parser_js.OptionFlag<string | undefined, _oclif_core_lib_interfaces_parser_js.CustomOptions>;
+    port: _oclif_core_lib_interfaces_parser_js.OptionFlag<number, _oclif_core_lib_interfaces_parser_js.CustomOptions>;
     force: _oclif_core_lib_interfaces_parser_js.BooleanFlag<boolean>;
 };
 declare function flagsToCamelObject(obj: Record<string, any>): any;
@@ -14,5 +14,11 @@ declare function flagsToCamelObject(obj: Record<string, any>): any;
  * output: { force: true, installDeps: false,  language: 'js' }
  */
 declare function parseProcessFlags(processArgv: string[], flagMap?: Record<string, string>): any;
+/**
+ * Create a deprecated flag to prevent the CLI from crashing when a deprecated flag is used.
+ * Displays an info message when the flag is used.
+ * @param name The name of the flag.
+ */
+declare function deprecated(name: string): _oclif_core_lib_interfaces_parser_js.FlagDefinition<unknown, Record<string, unknown>>;
 
-export { commonFlags, flagsToCamelObject, parseProcessFlags };
+export { commonFlags, deprecated, flagsToCamelObject, parseProcessFlags };

package/dist/{utils → lib}/flags.js

@@ -1,5 +1,7 @@
-import Flags from '@oclif/core/lib/flags.js';
-import { string } from '@shopify/cli-kit';
+import { Flags } from '@oclif/core';
+import { camelize } from '@shopify/cli-kit/common/string';
+import { renderInfo } from '@shopify/cli-kit/node/ui';
+import { colors } from './colors.js';
 
 const commonFlags = {
   path: Flags.string({
@@ -19,7 +21,7 @@ const commonFlags = {
 };
 function flagsToCamelObject(obj) {
   return Object.entries(obj).reduce((acc, [key, value]) => {
-    acc[string.camelize(key)] = value;
+    acc[camelize(key)] = value;
     return acc;
   }, {});
 }
@@ -41,5 +43,18 @@ function parseProcessFlags(processArgv, flagMap = {}) {
   }
   return flagsToCamelObject(options);
 }
+function deprecated(name) {
+  return Flags.custom({
+    parse: () => {
+      renderInfo({
+        headline: `The ${colors.bold(
+          name
+        )} flag is deprecated and will be removed in a future version of Shopify CLI.`
+      });
+      return Promise.resolve(" ");
+    },
+    hidden: true
+  });
+}
 
-export { commonFlags, flagsToCamelObject, parseProcessFlags };
+export { commonFlags, deprecated, flagsToCamelObject, parseProcessFlags };

package/dist/lib/flags.test.d.ts

@@ -0,0 +1 @@
+

package/dist/{utils → lib}/mini-oxygen.js

@@ -1,5 +1,7 @@
-import { path, file, output } from '@shopify/cli-kit';
-import colors from '@shopify/cli-kit/node/colors';
+import { outputInfo, outputContent, outputToken } from '@shopify/cli-kit/node/output';
+import { resolvePath } from '@shopify/cli-kit/node/path';
+import { fileExists } from '@shopify/cli-kit/node/fs';
+import { colors } from './colors.js';
 
 async function startMiniOxygen({
   root,
@@ -10,7 +12,7 @@ async function startMiniOxygen({
 }) {
   const { default: miniOxygen } = await import('@shopify/mini-oxygen');
   const miniOxygenPreview = miniOxygen.default ?? miniOxygen;
-  const dotenvPath = path.resolve(root, ".env");
+  const dotenvPath = resolvePath(root, ".env");
   const { port: actualPort } = await miniOxygenPreview({
     workerFile: buildPathWorkerFile,
     assetsDir: buildPathClient,
@@ -20,18 +22,18 @@ async function startMiniOxygen({
     autoReload: watch,
     modules: true,
     env: process.env,
-    envPath: await file.exists(dotenvPath) ? dotenvPath : void 0,
+    envPath: await fileExists(dotenvPath) ? dotenvPath : void 0,
     log: () => {
     },
-    buildWatchPaths: watch ? [path.resolve(root, buildPathWorkerFile)] : void 0,
+    buildWatchPaths: watch ? [resolvePath(root, buildPathWorkerFile)] : void 0,
     onResponse: (request, response) => logResponse(
       request,
       response
     )
   });
   const listeningAt = `http://localhost:${actualPort}`;
-  output.info(
-    output.content`🚥 MiniOxygen server started at ${output.token.link(
+  outputInfo(
+    outputContent`🚥 MiniOxygen server started at ${outputToken.link(
       listeningAt,
       listeningAt
     )}\n`
@@ -57,15 +59,15 @@ function logResponse(request, response) {
       route = url.pathname;
       info = `[${dataParam}]`;
     }
-    const colorizeStatus = response.status < 300 ? output.token.green : response.status < 400 ? output.token.cyan : output.token.errorText;
-    output.info(
-      output.content`${request.method.padStart(6)}  ${colorizeStatus(
+    const colorizeStatus = response.status < 300 ? outputToken.green : response.status < 400 ? outputToken.cyan : outputToken.errorText;
+    outputInfo(
+      outputContent`${request.method.padStart(6)}  ${colorizeStatus(
         String(response.status)
-      )}  ${output.token.italic(type.padEnd(7, " "))} ${route}${info ? " " + colors.dim(info) : ""} ${request.headers.get("purpose") === "prefetch" ? output.token.italic("(prefetch)") : ""}`
+      )}  ${outputToken.italic(type.padEnd(7, " "))} ${route}${info ? " " + colors.dim(info) : ""} ${request.headers.get("purpose") === "prefetch" ? outputToken.italic("(prefetch)") : ""}`
     );
   } catch {
     if (request && response) {
-      output.info(`${request.method} ${response.status} ${request.url}`);
+      outputInfo(`${request.method} ${response.status} ${request.url}`);
     }
   }
 }

package/dist/{utils → lib}/missing-routes.js

@@ -12,7 +12,7 @@ const REQUIRED_ROUTES = [
   "pages/:pageHandle",
   "policies/:policyHandle",
   "search",
-  "discounts/:discountCode",
+  "discount/:discountCode",
   "account",
   "account/login",
   "account/register",

package/dist/lib/remix-version-interop.d.ts

@@ -0,0 +1,11 @@
+declare function isRemixV2(): boolean;
+declare function getV2Flags(root: string): Promise<{
+    isV2Meta: boolean;
+    isV2ErrorBoundary: boolean;
+    isV2RouteConvention: boolean;
+}>;
+type RemixV2Flags = Partial<Awaited<ReturnType<typeof getV2Flags>>>;
+declare function convertRouteToV2(route: string): string;
+declare function convertTemplateToRemixVersion(template: string, { isV2Meta, isV2ErrorBoundary }: RemixV2Flags): string;
+
+export { RemixV2Flags, convertRouteToV2, convertTemplateToRemixVersion, getV2Flags, isRemixV2 };