@shopify/cli-hydrogen 10.0.2 → 11.0.0

package/dist/lib/remix-config.js

@@ -1,15 +1,11 @@
 import { createRequire } from 'node:module';
 import path from 'node:path';
-import { readdir } from 'node:fs/promises';
+import 'node:fs/promises';
 import { AbortError } from '@shopify/cli-kit/node/error';
-import { outputWarn } from '@shopify/cli-kit/node/output';
-import { fileExists } from '@shopify/cli-kit/node/fs';
-import { muteRemixLogs } from './log.js';
+import '@shopify/cli-kit/node/fs';
 import { REQUIRED_REMIX_VERSION } from './remix-version-check.js';
 import { findFileWithExtension } from './file.js';
-import { isViteProject, getViteConfig } from './vite-config.js';
-import { importLocal, importVite } from './import-utils.js';
-import { isHydrogenMonorepo, hydrogenPackagesPath } from './build.js';
+import { isViteProject, REMIX_COMPILER_ERROR_MESSAGE, getViteConfig } from './vite-config.js';
 
 async function hasRemixConfigFile(root) {
   const result = await findFileWithExtension(root, "remix.config");
@@ -23,7 +19,6 @@ async function isClassicProject(root) {
 const BUILD_DIR = "dist";
 const CLIENT_SUBDIR = "client";
 const WORKER_SUBDIR = "worker";
-const oxygenServerMainFields = ["browser", "module", "main"];
 function getProjectPaths(appPath) {
   const root = appPath ?? process.cwd();
   const publicPath = path.join(root, "public");
@@ -52,130 +47,10 @@ function getRawRemixConfig(root) {
   });
 }
 async function getRemixConfig(root, mode = process.env.NODE_ENV) {
-  if (await isViteProject(root)) {
-    return (await getViteConfig(root)).remixConfig;
-  }
-  await muteRemixLogs(root);
-  const { resolveConfig } = await importLocal(
-    "@remix-run/dev/dist/config.js",
-    root
-  ).catch(handleRemixImportFail);
-  const { createContext } = await importLocal(
-    "@remix-run/dev/dist/vite/vite-node.js",
-    root
-  ).catch(handleRemixImportFail);
-  const appConfig = await getRawRemixConfig(root);
-  const routesViteNodeContext = await createContext({ root, mode });
-  const vite = await importVite(root);
-  const config = await resolveConfig(appConfig, {
-    rootDirectory: root,
-    serverMode: mode,
-    vite,
-    routesViteNodeContext
-  });
-  if (isHydrogenMonorepo && hydrogenPackagesPath) {
-    const packagesPath = hydrogenPackagesPath;
-    config.watchPaths ??= [];
-    config.watchPaths.push(
-      ...(await readdir(packagesPath)).map(
-        (pkg) => pkg === "hydrogen-react" ? path.resolve(packagesPath, pkg, "dist", "browser-dev", "index.mjs") : path.resolve(packagesPath, pkg, "dist", "development", "index.js")
-      )
-    );
-    config.watchPaths.push(
-      path.join(packagesPath, "cli", "dist", "virtual-routes", "**", "*")
-    );
-  }
-  routesViteNodeContext.server.server.close();
-  return config;
-}
-function assertOxygenChecks(config) {
-  try {
-    createRequire(import.meta.url).resolve("@shopify/remix-oxygen");
-  } catch {
-    return;
-  }
-  if (!config.serverEntryPoint) {
-    throw new AbortError(
-      "Could not find a server entry point.",
-      "Please add a server option to your remix.config.js pointing to an Oxygen worker entry file."
-    );
-  } else {
-    assertEntryFileExists(config.rootDirectory, config.serverEntryPoint);
-  }
-  if (config.serverPlatform !== "neutral") {
-    throw new AbortError(
-      'The serverPlatform in remix.config.js must be "neutral".'
-    );
-  }
-  if (config.serverModuleFormat !== "esm") {
-    throw new AbortError(
-      'The serverModuleFormat in remix.config.js must be "esm".'
-    );
-  }
-  if (config.serverDependenciesToBundle !== "all") {
-    throw new AbortError(
-      'The serverDependenciesToBundle in remix.config.js must be "all".'
-    );
-  }
-  if (!config.serverConditions?.includes("worker")) {
-    throw new AbortError(
-      'The serverConditions in remix.config.js must include "worker".'
-    );
-  }
-  if (process.env.NODE_ENV === "development" && !config.serverConditions?.includes("development")) {
-    outputWarn(
-      "Add `process.env.NODE_ENV` value to serverConditions in remix.config.js to enable debugging features in development."
-    );
-  }
-  if (!config.serverMainFields || !oxygenServerMainFields.every((v, i) => config.serverMainFields?.[i] === v)) {
-    throw new AbortError(
-      `The serverMainFields in remix.config.js must be ${JSON.stringify(
-        oxygenServerMainFields
-      )}.`
-    );
-  }
-  const cdnUrl = process.env.HYDROGEN_ASSET_BASE_URL;
-  if (cdnUrl && !config.publicPath.startsWith(cdnUrl)) {
-    throw new AbortError(
-      "The publicPath in remix.config.js must be prepended with the value of `process.env.HYDROGEN_ASSET_BASE_URL`."
-    );
-  }
-  const expectedServerBuildPath = path.join(
-    BUILD_DIR,
-    WORKER_SUBDIR,
-    "index.js"
-  );
-  if (config.serverBuildPath !== path.resolve(config.rootDirectory, expectedServerBuildPath)) {
-    throw new AbortError(
-      `The serverBuildPath in remix.config.js must be "${expectedServerBuildPath}".`
-    );
-  }
-  const expectedAssetsBuildDirectory = path.join(BUILD_DIR, CLIENT_SUBDIR);
-  if (!config.assetsBuildDirectory.startsWith(
-    path.resolve(config.rootDirectory, expectedAssetsBuildDirectory)
-  )) {
-    throw new AbortError(
-      `The assetsBuildDirectory in remix.config.js must be in "${expectedAssetsBuildDirectory}".`
-    );
-  }
-}
-async function assertEntryFileExists(root, fileRelative) {
-  const fileAbsolute = path.resolve(root, fileRelative);
-  const exists = await fileExists(fileAbsolute);
-  if (!exists) {
-    if (!path.extname(fileAbsolute)) {
-      const files = await readdir(path.dirname(fileAbsolute));
-      const exists2 = files.some((file) => {
-        const { name, ext } = path.parse(file);
-        return name === path.basename(fileAbsolute) && /^\.[jt]s$/.test(ext);
-      });
-      if (exists2) return;
-    }
-    throw new AbortError(
-      `Entry file "${fileRelative}" not found.`,
-      "Please ensure the file exists and that the path is correctly added to the `server` property in remix.config.js."
-    );
+  if (!await isViteProject(root)) {
+    throw new AbortError(REMIX_COMPILER_ERROR_MESSAGE);
   }
+  return (await getViteConfig(root)).remixConfig;
 }
 
-export { assertOxygenChecks, getProjectPaths, getRawRemixConfig, getRemixConfig, handleRemixImportFail, hasRemixConfigFile, isClassicProject };
+export { getProjectPaths, getRawRemixConfig, getRemixConfig, handleRemixImportFail, hasRemixConfigFile, isClassicProject };

package/dist/lib/setups/routes/generate.js

@@ -22,7 +22,8 @@ const ROUTE_MAP = {
   account: "account*",
   search: ["search", "api.predictive-search"],
   robots: "[robots.txt]",
-  sitemap: ["[sitemap.xml]", "sitemap.$type.$page[.xml]"]
+  sitemap: ["[sitemap.xml]", "sitemap.$type.$page[.xml]"],
+  tokenlessApi: "api.$version.[graphql.json]"
 };
 let allRouteTemplateFiles = [];
 async function getResolvedRoutes(routeKeys = Object.keys(ROUTE_MAP)) {

package/dist/lib/vite-config.js

@@ -4,6 +4,7 @@ import { importVite } from './import-utils.js';
 import { hasRemixConfigFile } from './remix-config.js';
 import { renderWarning } from '@shopify/cli-kit/node/ui';
 
+const REMIX_COMPILER_ERROR_MESSAGE = "Classic Remix Compiler projects are no longer supported, please upgrade to Vite by running 'npx shopify hydrogen setup vite'";
 async function hasViteConfig(root) {
   const result = await findFileWithExtension(root, "vite.config");
   return !!result.filepath;
@@ -57,8 +58,8 @@ async function getViteConfig(root, ssrEntryFlag) {
     resolvedViteConfig,
     userViteConfig: maybeConfig.config,
     remixConfig: {
-      routes: routes ?? {},
-      appDirectory: appDirectory ?? joinPath(resolvedViteConfig.root, "app"),
+      routes,
+      appDirectory,
       rootDirectory: resolvedViteConfig.root,
       serverEntryPoint: (await findFileWithExtension(
         dirname(resolvedSsrEntry),
@@ -68,12 +69,15 @@ async function getViteConfig(root, ssrEntryFlag) {
   };
 }
 function getRemixConfigFromVite(viteConfig) {
-  const { remixConfig } = findHydrogenPlugin(viteConfig)?.api?.getPluginOptions() ?? {};
-  return remixConfig ? {
-    appDirectory: remixConfig.appDirectory,
-    serverBuildFile: remixConfig.serverBuildFile,
-    routes: remixConfig.routes
-  } : {};
+  if (!viteConfig.__reactRouterPluginContext) {
+    throw new Error("Could not resolve React Router config");
+  }
+  const { appDirectory, serverBuildFile, routes } = viteConfig.__reactRouterPluginContext.reactRouterConfig;
+  return {
+    appDirectory,
+    serverBuildFile,
+    routes
+  };
 }
 function findPlugin(config, name) {
   return config.plugins.find((plugin) => plugin.name === name);
@@ -85,4 +89,4 @@ function findOxygenPlugin(config) {
   return findPlugin(config, "oxygen:main");
 }
 
-export { findHydrogenPlugin, findOxygenPlugin, getViteConfig, hasViteConfig, isViteProject };
+export { REMIX_COMPILER_ERROR_MESSAGE, findHydrogenPlugin, findOxygenPlugin, getViteConfig, hasViteConfig, isViteProject };

package/oclif.manifest.json

@@ -668,20 +668,6 @@
           "name": "disable-deps-optimizer",
           "allowNo": false,
           "type": "boolean"
-        },
-        "legacy-runtime": {
-          "description": "[Classic Remix Compiler] Runs the app in a Node.js sandbox instead of an Oxygen worker.",
-          "env": "SHOPIFY_HYDROGEN_FLAG_LEGACY_RUNTIME",
-          "name": "legacy-runtime",
-          "allowNo": false,
-          "type": "boolean"
-        },
-        "sourcemap": {
-          "description": "[Classic Remix Compiler] Controls whether server sourcemaps are generated. Default to `true`. Deactivate `--no-sourcemaps`.",
-          "env": "SHOPIFY_HYDROGEN_FLAG_SOURCEMAP",
-          "name": "sourcemap",
-          "allowNo": true,
-          "type": "boolean"
         }
       },
       "hasDynamicHelp": false,
@@ -880,7 +866,7 @@
       "aliases": [],
       "args": {
         "routeName": {
-          "description": "The route to generate. One of home,page,cart,products,collections,policies,blogs,account,search,robots,sitemap,all.",
+          "description": "The route to generate. One of home,page,cart,products,collections,policies,blogs,account,search,robots,sitemap,tokenlessApi,all.",
           "name": "routeName",
           "options": [
             "home",
@@ -894,6 +880,7 @@
             "search",
             "robots",
             "sitemap",
+            "tokenlessApi",
             "all"
           ],
           "required": true
@@ -1318,13 +1305,6 @@
           "multiple": false,
           "type": "option"
         },
-        "legacy-runtime": {
-          "description": "Runs the app in a Node.js sandbox instead of an Oxygen worker.",
-          "env": "SHOPIFY_HYDROGEN_FLAG_LEGACY_RUNTIME",
-          "name": "legacy-runtime",
-          "allowNo": false,
-          "type": "boolean"
-        },
         "env": {
           "description": "Specifies the environment to perform the operation using its handle. Fetch the handle using the `env list` command.",
           "exclusive": [
@@ -1748,5 +1728,5 @@
       ]
     }
   },
-  "version": "10.0.2"
+  "version": "11.0.0"
 }

package/package.json

@@ -4,7 +4,7 @@
     "access": "public",
     "@shopify:registry": "https://registry.npmjs.org"
   },
-  "version": "10.0.2",
+  "version": "11.0.0",
   "license": "MIT",
   "type": "module",
   "repository": {
@@ -21,7 +21,7 @@
     "test:watch": "cross-env SHOPIFY_UNIT_TEST=1 LANG=en-US.UTF-8 vitest --test-timeout=60000"
   },
   "devDependencies": {
-    "@remix-run/dev": "^2.16.1",
+    "@react-router/dev": "7.6.0",
     "@types/diff": "^5.0.2",
     "@types/gunzip-maybe": "^1.4.0",
     "@types/prettier": "^2.7.2",
@@ -60,7 +60,7 @@
   },
   "peerDependencies": {
     "@graphql-codegen/cli": "^5.0.2",
-    "@remix-run/dev": "^2.16.1",
+    "@react-router/dev": "7.6.0",
     "@shopify/hydrogen-codegen": "^0.3.3",
     "@shopify/mini-oxygen": "^3.2.1",
     "graphql-config": "^5.0.3",
@@ -70,7 +70,7 @@
     "@graphql-codegen/cli": {
       "optional": true
     },
-    "@remix-run/dev": {
+    "@react-router/dev": {
       "optional": true
     },
     "@shopify/hydrogen-codegen": {

package/dist/lib/classic-compiler/build.js

@@ -1,139 +0,0 @@
-import { outputInfo, outputToken, outputContent, outputWarn } from '@shopify/cli-kit/node/output';
-import { rmdir, fileSize, glob, readFile, writeFile, fileExists, copyFile } from '@shopify/cli-kit/node/fs';
-import { relativePath, joinPath } from '@shopify/cli-kit/node/path';
-import { getPackageManager } from '@shopify/cli-kit/node/node-package-manager';
-import colors from '@shopify/cli-kit/node/colors';
-import { getProjectPaths, getRemixConfig, handleRemixImportFail, assertOxygenChecks } from '../remix-config.js';
-import { checkLockfileStatus } from '../check-lockfile.js';
-import { findMissingRoutes } from '../route-validator.js';
-import { muteRemixLogs, createRemixLogger } from '../log.js';
-import { codegen } from '../codegen.js';
-import { classicBuildBundleAnalysis, classicGetBundleAnalysisSummary } from '../bundle/analyzer.js';
-import { isCI } from '../is-ci.js';
-import { importLocal } from '../import-utils.js';
-
-const LOG_WORKER_BUILT = "\u{1F4E6} Worker built";
-const WORKER_BUILD_SIZE_LIMIT = 5;
-async function runClassicCompilerBuild({
-  directory,
-  useCodegen = false,
-  codegenConfigPath,
-  sourcemap = false,
-  disableRouteWarning = false,
-  bundleStats = true,
-  lockfileCheck = true,
-  assetPath
-}) {
-  if (!process.env.NODE_ENV) {
-    process.env.NODE_ENV = "production";
-  }
-  if (assetPath) {
-    process.env.HYDROGEN_ASSET_BASE_URL = assetPath;
-  }
-  const { root, buildPath, buildPathClient, buildPathWorkerFile, publicPath } = getProjectPaths(directory);
-  if (lockfileCheck) {
-    await checkLockfileStatus(root, isCI());
-  }
-  await muteRemixLogs(root);
-  console.time(LOG_WORKER_BUILT);
-  outputInfo(`
-\u{1F3D7}\uFE0F  Building in ${process.env.NODE_ENV} mode...`);
-  const [remixConfig, [{ build }, { logThrown }, { createFileWatchCache }]] = await Promise.all([
-    getRemixConfig(root),
-    Promise.all([
-      importLocal("@remix-run/dev/dist/compiler/build.js", root),
-      importLocal(
-        "@remix-run/dev/dist/compiler/utils/log.js",
-        root
-      ),
-      importLocal(
-        "@remix-run/dev/dist/compiler/fileWatchCache.js",
-        root
-      )
-    ]).catch(handleRemixImportFail),
-    rmdir(buildPath, { force: true })
-  ]);
-  assertOxygenChecks(remixConfig);
-  await Promise.all([
-    copyPublicFiles(publicPath, buildPathClient),
-    build({
-      config: remixConfig,
-      options: {
-        mode: process.env.NODE_ENV,
-        sourcemap
-      },
-      logger: createRemixLogger(),
-      fileWatchCache: createFileWatchCache()
-    }).catch((thrown) => {
-      logThrown(thrown);
-      if (process.env.SHOPIFY_UNIT_TEST) {
-        throw thrown;
-      } else {
-        process.exit(1);
-      }
-    }),
-    useCodegen && codegen({ ...remixConfig, configFilePath: codegenConfigPath })
-  ]);
-  if (process.env.NODE_ENV !== "development") {
-    console.timeEnd(LOG_WORKER_BUILT);
-    const bundleAnalysisPath = await classicBuildBundleAnalysis(buildPath);
-    const sizeMB = await fileSize(buildPathWorkerFile) / (1024 * 1024);
-    const formattedSize = colors.yellow(sizeMB.toFixed(2) + " MB");
-    outputInfo(
-      outputContent`   ${colors.dim(
-        relativePath(root, buildPathWorkerFile)
-      )}  ${bundleAnalysisPath ? outputToken.link(formattedSize, bundleAnalysisPath) : formattedSize}\n`
-    );
-    if (bundleStats && bundleAnalysisPath) {
-      outputInfo(
-        outputContent`${await classicGetBundleAnalysisSummary(buildPathWorkerFile) || "\n"}\n    │\n    └─── ${outputToken.link(
-          "Complete analysis: " + bundleAnalysisPath,
-          bundleAnalysisPath
-        )}\n\n`
-      );
-    }
-    if (sizeMB >= WORKER_BUILD_SIZE_LIMIT) {
-      outputWarn(
-        `\u{1F6A8} Smaller worker bundles are faster to deploy and run.${remixConfig.serverMinify ? "" : "\n   Minify your bundle by adding `serverMinify: true` to remix.config.js."}
-   Learn more about optimizing your worker bundle file: https://h2o.fyi/debugging/bundle-size
-`
-      );
-    }
-  }
-  if (!disableRouteWarning) {
-    const missingRoutes = findMissingRoutes(remixConfig);
-    if (missingRoutes.length) {
-      const packageManager = await getPackageManager(root);
-      const exec = packageManager === "npm" ? "npx" : packageManager;
-      outputWarn(
-        `Heads up: Shopify stores have a number of standard routes that aren\u2019t set up yet.
-Some functionality and backlinks might not work as expected until these are created or redirects are set up.
-This build is missing ${missingRoutes.length} route${missingRoutes.length > 1 ? "s" : ""}. For more details, run \`${exec} shopify hydrogen check routes\`.
-`
-      );
-    }
-  }
-  if (process.env.NODE_ENV !== "development") {
-    await cleanClientSourcemaps(buildPathClient);
-  }
-}
-async function cleanClientSourcemaps(buildPathClient) {
-  const bundleFiles = await glob(joinPath(buildPathClient, "**/*.js"));
-  await Promise.all(
-    bundleFiles.map(async (filePath) => {
-      const file = await readFile(filePath);
-      return await writeFile(
-        filePath,
-        file.replace(/\/\/# sourceMappingURL=.+\.js\.map$/gm, "")
-      );
-    })
-  );
-}
-async function copyPublicFiles(publicPath, buildPathClient) {
-  if (!await fileExists(publicPath)) {
-    return;
-  }
-  return copyFile(publicPath, buildPathClient);
-}
-
-export { copyPublicFiles, runClassicCompilerBuild };

package/dist/lib/classic-compiler/debug-cpu.js

@@ -1,52 +0,0 @@
-import { outputWarn } from '@shopify/cli-kit/node/output';
-import { createRemixLogger } from '../log.js';
-import { importLocal } from '../import-utils.js';
-import { handleRemixImportFail, getRemixConfig } from '../remix-config.js';
-
-async function runClassicCompilerDebugCpu({
-  directory,
-  hooks
-}) {
-  const [{ watch }, { createFileWatchCache }] = await Promise.all([
-    importLocal("@remix-run/dev/dist/compiler/watch.js", directory),
-    importLocal(
-      "@remix-run/dev/dist/compiler/fileWatchCache.js",
-      directory
-    )
-  ]).catch(handleRemixImportFail);
-  const fileWatchCache = createFileWatchCache();
-  const closeWatcher = await watch(
-    {
-      config: await getRemixConfig(directory),
-      options: {
-        mode: process.env.NODE_ENV,
-        sourcemap: true
-      },
-      fileWatchCache,
-      logger: createRemixLogger()
-    },
-    {
-      onBuildStart: hooks.onServerBuildStart,
-      async onBuildFinish(context, duration, succeeded) {
-        if (succeeded) {
-          await hooks.onServerBuildFinish();
-        } else {
-          outputWarn("\nBuild failed, waiting for changes to restart...");
-        }
-      },
-      async onFileChanged(file) {
-        fileWatchCache.invalidateFile(file);
-      },
-      async onFileDeleted(file) {
-        fileWatchCache.invalidateFile(file);
-      }
-    }
-  );
-  return {
-    async close() {
-      await closeWatcher();
-    }
-  };
-}
-
-export { runClassicCompilerDebugCpu };