@shopify/cli-hydrogen 4.0.0-alpha.1 → 4.0.0-alpha.10

package/dist/commands/hydrogen/build.js

@@ -1,18 +1,18 @@
 import path from 'path';
-import * as remix from '@remix-run/dev/dist/compiler.js';
-import fsExtra from 'fs-extra';
 import { output } from '@shopify/cli-kit';
 import colors from '@shopify/cli-kit/node/colors';
 import { getProjectPaths, getRemixConfig } from '../../utils/config.js';
-import { flags } from '../../utils/flags.js';
+import { commonFlags } from '../../utils/flags.js';
 import Command from '@shopify/cli-kit/node/base-command';
-import { Flags } from '@oclif/core';
+import Flags from '@oclif/core/lib/flags.js';
+import { checkLockfileStatus } from '../../utils/check-lockfile.js';
+import { findMissingRoutes } from '../../utils/missing-routes.js';
 
 const LOG_WORKER_BUILT = "\u{1F4E6} Worker built";
 class Build extends Command {
   static description = "Builds a Hydrogen storefront for production";
   static flags = {
-    ...flags,
+    ...commonFlags,
     sourcemap: Flags.boolean({
       env: "SHOPIFY_HYDROGEN_FLAG_SOURCEMAP"
     }),
@@ -20,21 +20,22 @@ class Build extends Command {
       env: "SHOPIFY_HYDROGEN_FLAG_SOURCEMAP",
       required: true
     }),
-    minify: Flags.boolean({
-      description: "Minify the build output",
-      env: "SHOPIFY_HYDROGEN_FLAG_MINIFY"
+    disableRouteWarning: Flags.boolean({
+      description: "Disable warning about missing standard routes",
+      env: "SHOPIFY_HYDROGEN_FLAG_DISABLE_ROUTE_WARNING"
     })
   };
   async run() {
-    const { flags: flags2 } = await this.parse(Build);
-    const directory = flags2.path ? path.resolve(flags2.path) : process.cwd();
-    await runBuild({ ...flags2, path: directory });
+    const { flags } = await this.parse(Build);
+    const directory = flags.path ? path.resolve(flags.path) : process.cwd();
+    await runBuild({ ...flags, path: directory });
   }
 }
 async function runBuild({
   entry,
+  path: appPath,
   sourcemap = true,
-  path: appPath
+  disableRouteWarning = false
 }) {
   if (!process.env.NODE_ENV) {
     process.env.NODE_ENV = "production";
@@ -47,18 +48,24 @@ async function runBuild({
     buildPathWorkerFile,
     publicPath
   } = getProjectPaths(appPath, entry);
+  await checkLockfileStatus(root);
   console.time(LOG_WORKER_BUILT);
-  const remixConfig = await getRemixConfig(root, entryFile, publicPath);
-  await fsExtra.rm(buildPath, { force: true, recursive: true });
+  const { default: fsExtra } = await import('fs-extra');
+  const [remixConfig] = await Promise.all([
+    getRemixConfig(root, entryFile, publicPath),
+    fsExtra.rm(buildPath, { force: true, recursive: true })
+  ]);
   output.info(`
 \u{1F3D7}\uFE0F  Building in ${process.env.NODE_ENV} mode...`);
+  const { build } = await import('@remix-run/dev/dist/compiler/build.js');
+  const { logCompileFailure } = await import('@remix-run/dev/dist/compiler/onCompileFailure.js');
   await Promise.all([
     copyPublicFiles(publicPath, buildPathClient),
-    remix.build(remixConfig, {
+    build(remixConfig, {
       mode: process.env.NODE_ENV,
       sourcemap,
-      onBuildFailure: (failure) => {
-        remix.formatBuildFailure(failure);
+      onCompileFailure: (failure) => {
+        logCompileFailure(failure);
         throw Error();
       }
     })
@@ -78,8 +85,18 @@ async function runBuild({
       );
     }
   }
+  if (!disableRouteWarning) {
+    const missingRoutes = findMissingRoutes(remixConfig);
+    if (missingRoutes.length) {
+      output.warn(
+        "\u{1F6A8} Standard Shopify routes missing; run `shopify hydrogen check routes` for more details."
+      );
+    }
+  }
+  process.exit(0);
 }
-function copyPublicFiles(publicPath, buildPathClient) {
+async function copyPublicFiles(publicPath, buildPathClient) {
+  const { default: fsExtra } = await import('fs-extra');
   return fsExtra.copy(publicPath, buildPathClient, {
     recursive: true,
     overwrite: true

package/dist/commands/hydrogen/check.js

@@ -0,0 +1,34 @@
+import Command from '@shopify/cli-kit/node/base-command';
+import { path } from '@shopify/cli-kit';
+import { commonFlags } from '../../utils/flags.js';
+import { getRemixConfig } from '../../utils/config.js';
+import { logMissingRoutes, findMissingRoutes } from '../../utils/missing-routes.js';
+
+class GenerateRoute extends Command {
+  static flags = {
+    path: commonFlags.path
+  };
+  static args = [
+    {
+      name: "resource",
+      description: `The resource to check. Currently only 'routes' is supported.`,
+      required: true,
+      options: ["routes"]
+    }
+  ];
+  async run() {
+    const { flags, args } = await this.parse(GenerateRoute);
+    const directory = flags.path ? path.resolve(flags.path) : process.cwd();
+    if (args.resource === "routes") {
+      await runCheckRoutes({ directory });
+    } else {
+      throw new Error("Invalid command argument.");
+    }
+  }
+}
+async function runCheckRoutes({ directory }) {
+  const remixConfig = await getRemixConfig(directory, "", "");
+  logMissingRoutes(findMissingRoutes(remixConfig));
+}
+
+export { GenerateRoute as default };

package/dist/commands/hydrogen/dev.js

@@ -1,14 +1,15 @@
 import path from 'path';
-import fs from 'fs-extra';
-import * as remix from '@remix-run/dev/dist/compiler.js';
+import fs from 'fs/promises';
 import { output } from '@shopify/cli-kit';
 import { copyPublicFiles } from './build.js';
 import { getProjectPaths, getRemixConfig } from '../../utils/config.js';
 import { muteDevLogs } from '../../utils/log.js';
-import { flags } from '../../utils/flags.js';
+import { commonFlags } from '../../utils/flags.js';
 import Command from '@shopify/cli-kit/node/base-command';
-import { Flags } from '@oclif/core';
+import Flags from '@oclif/core/lib/flags.js';
 import { startMiniOxygen } from '../../utils/mini-oxygen.js';
+import { checkHydrogenVersion } from '../../utils/check-version.js';
+import { addVirtualRoutes } from '../../utils/virtual-routes.js';
 
 const LOG_INITIAL_BUILD = "\n\u{1F3C1} Initial build";
 const LOG_REBUILDING = "\u{1F9F1} Rebuilding...";
@@ -16,7 +17,7 @@ const LOG_REBUILT = "\u{1F680} Rebuilt";
 class Dev extends Command {
   static description = "Runs Hydrogen storefront in a MiniOxygen worker in development";
   static flags = {
-    ...flags,
+    ...commonFlags,
     port: Flags.integer({
       description: "Port to run the preview server on",
       env: "SHOPIFY_HYDROGEN_FLAG_PORT",
@@ -25,49 +26,55 @@ class Dev extends Command {
     entry: Flags.string({
       env: "SHOPIFY_HYDROGEN_FLAG_ENTRY",
       required: true
+    }),
+    disableVirtualRoutes: Flags.boolean({
+      env: "SHOPIFY_HYDROGEN_FLAG_DISABLE_VIRTUAL_ROUTES",
+      default: false
     })
   };
   async run() {
-    const { flags: flags2 } = await this.parse(Dev);
-    const directory = flags2.path ? path.resolve(flags2.path) : process.cwd();
-    await runDev({ ...flags2, path: directory });
+    const { flags } = await this.parse(Dev);
+    const directory = flags.path ? path.resolve(flags.path) : process.cwd();
+    await runDev({ ...flags, path: directory });
   }
 }
 async function runDev({
   entry,
   port,
-  path: appPath
+  path: appPath,
+  disableVirtualRoutes
 }) {
   if (!process.env.NODE_ENV)
     process.env.NODE_ENV = "development";
   muteDevLogs();
-  await compileAndWatch(getProjectPaths(appPath, entry), { port });
+  await compileAndWatch(entry, appPath, port, disableVirtualRoutes);
 }
-async function compileAndWatch(projectPaths, options = {}, isInit = true) {
-  isInit && console.time(LOG_INITIAL_BUILD);
-  const { root, entryFile, publicPath, buildPathClient, buildPathWorkerFile } = projectPaths;
-  const shouldReloadRemixApp = (file) => file.startsWith(path.resolve(root, "remix.config.")) || process.env.LOCAL_DEV && (file.includes(path.resolve("/hydrogen/src/templates/")) || file.includes(path.resolve("/hydrogen/dist/build/index.js")));
-  const remixConfig = await getRemixConfig(
-    root,
-    entryFile,
-    publicPath,
-    options.cacheBust
-  );
+async function compileAndWatch(entry, appPath, port, disableVirtualRoutes = false) {
+  console.time(LOG_INITIAL_BUILD);
+  const { root, entryFile, publicPath, buildPathClient, buildPathWorkerFile } = getProjectPaths(appPath, entry);
+  const checkingHydrogenVersion = checkHydrogenVersion(root);
   const copyingFiles = copyPublicFiles(publicPath, buildPathClient);
-  const stopCompileWatcher = await remix.watch(remixConfig, {
+  const reloadConfig = async () => {
+    const config = await getRemixConfig(root, entryFile, publicPath);
+    return disableVirtualRoutes ? config : addVirtualRoutes(config);
+  };
+  const { watch } = await import('@remix-run/dev/dist/compiler/watch.js');
+  await watch(await reloadConfig(), {
+    reloadConfig,
     mode: process.env.NODE_ENV,
     async onInitialBuild() {
       await copyingFiles;
-      if (isInit) {
-        console.timeEnd(LOG_INITIAL_BUILD);
-        await startMiniOxygen({
-          root,
-          port: options.port,
-          watch: true,
-          buildPathWorkerFile,
-          buildPathClient
-        });
-      }
+      console.timeEnd(LOG_INITIAL_BUILD);
+      await startMiniOxygen({
+        root,
+        port,
+        watch: true,
+        buildPathWorkerFile,
+        buildPathClient
+      });
+      const showUpgrade = await checkingHydrogenVersion;
+      if (showUpgrade)
+        showUpgrade();
     },
     async onFileCreated(file) {
       output.info(`
@@ -75,9 +82,6 @@ async function compileAndWatch(projectPaths, options = {}, isInit = true) {
       if (file.startsWith(publicPath)) {
         await copyPublicFiles(file, file.replace(publicPath, buildPathClient));
       }
-      if (shouldReloadRemixApp(file)) {
-        await reloadRemixApp(file);
-      }
     },
     async onFileChanged(file) {
       output.info(`
@@ -85,9 +89,6 @@ async function compileAndWatch(projectPaths, options = {}, isInit = true) {
       if (file.startsWith(publicPath)) {
         await copyPublicFiles(file, file.replace(publicPath, buildPathClient));
       }
-      if (shouldReloadRemixApp(file)) {
-        await reloadRemixApp(file);
-      }
     },
     async onFileDeleted(file) {
       output.info(`
@@ -95,9 +96,6 @@ async function compileAndWatch(projectPaths, options = {}, isInit = true) {
       if (file.startsWith(publicPath)) {
         await fs.unlink(file.replace(publicPath, buildPathClient));
       }
-      if (shouldReloadRemixApp(file)) {
-        await reloadRemixApp(file);
-      }
     },
     onRebuildStart() {
       output.info(LOG_REBUILDING);
@@ -107,10 +105,6 @@ async function compileAndWatch(projectPaths, options = {}, isInit = true) {
       console.timeEnd(LOG_REBUILT);
     }
   });
-  async function reloadRemixApp(cacheBust) {
-    await stopCompileWatcher();
-    compileAndWatch(projectPaths, { ...options, cacheBust }, false);
-  }
 }
 
 export { Dev as default, runDev };

package/dist/commands/hydrogen/generate/route.js

@@ -0,0 +1,174 @@
+import Command from '@shopify/cli-kit/node/base-command';
+import { path, error, file, ui } from '@shopify/cli-kit';
+import { renderSuccess } from '@shopify/cli-kit/node/ui';
+import { commonFlags } from '../../../utils/flags.js';
+import Flags from '@oclif/core/lib/flags.js';
+import ts from 'typescript';
+import prettier from 'prettier';
+
+const ROUTE_MAP = {
+  page: "/pages/$pageHandle",
+  cart: "/cart",
+  products: "/products/$productHandle",
+  collections: "/collections/$collectionHandle",
+  policies: ["/policies/index", "/policies/$policyHandle"],
+  robots: "/[robots.txt]",
+  sitemap: "/[sitemap.xml]",
+  account: ["/account/login", "/account/register"]
+};
+const ROUTES = [...Object.keys(ROUTE_MAP), "all"];
+class GenerateRoute extends Command {
+  static flags = {
+    path: commonFlags.path,
+    adapter: Flags.string({
+      description: "The Remix adapter for imports in the template (default: @shopify/remix-oxygen)",
+      env: "SHOPIFY_HYDROGEN_FLAG_ADAPTER"
+    }),
+    force: Flags.boolean({
+      char: "f",
+      description: "Overwrite existing files",
+      env: "SHOPIFY_HYDROGEN_FLAG_FORCE"
+    })
+  };
+  static args = [
+    {
+      name: "route",
+      description: `The route to generate a route for.`,
+      required: true,
+      options: ROUTES,
+      env: "SHOPIFY_HYDROGEN_ARG_ROUTE"
+    }
+  ];
+  async run() {
+    const result = /* @__PURE__ */ new Map();
+    const { flags, args } = await this.parse(GenerateRoute);
+    const directory = flags.path ? path.resolve(flags.path) : process.cwd();
+    const { route } = args;
+    const routePath = route === "all" ? Object.values(ROUTE_MAP).flat() : ROUTE_MAP[route];
+    if (!routePath) {
+      throw new error.Abort(
+        `No template generator found for ${route}. Try one of ${ROUTES.join()}`
+      );
+    }
+    const isTypescript = await file.exists(
+      path.join(directory, "tsconfig.json")
+    );
+    const routesArray = Array.isArray(routePath) ? routePath : [routePath];
+    try {
+      for (const item of routesArray) {
+        result.set(
+          item,
+          await runGenerate(item, {
+            directory,
+            typescript: isTypescript,
+            force: flags.force,
+            adapter: flags.adapter
+          })
+        );
+      }
+    } catch (err) {
+      throw new error.Abort(err.message);
+    }
+    const extension = isTypescript ? ".tsx" : ".jsx";
+    const success = Array.from(result.values()).filter(
+      (result2) => result2.operation !== "skipped"
+    );
+    renderSuccess({
+      headline: `${success.length} of ${result.size} route${result.size > 1 ? "s" : ""} generated`,
+      body: Array.from(result.entries()).map(([path2, result2]) => {
+        const { operation } = result2;
+        return `\u2022 [${operation}] app/routes${path2}${extension}`;
+      }).join("\n")
+    });
+  }
+}
+async function runGenerate(route, {
+  directory,
+  typescript,
+  force,
+  adapter,
+  templatesRoot = new URL("../../../", import.meta.url).pathname
+}) {
+  const extension = typescript ? ".tsx" : ".jsx";
+  const templatePath = path.join(templatesRoot, "templates", `${route}.tsx`);
+  const destinationPath = path.join(
+    directory,
+    "app",
+    "routes",
+    `${route}${extension}`
+  );
+  const relativeDestinationPath = path.relative(directory, destinationPath);
+  if (!force && await file.exists(destinationPath)) {
+    const options = [
+      { name: "No", value: "skip" },
+      { name: `Yes`, value: "overwrite" }
+    ];
+    const choice = await ui.prompt([
+      {
+        type: "select",
+        name: "value",
+        message: `The file ${path.relativize(
+          relativeDestinationPath
+        )} already exists. Do you want to overwrite it?`,
+        choices: options
+      }
+    ]);
+    return {
+      operation: choice.value === "skip" ? "skipped" : "overwritten"
+    };
+  }
+  let templateContent = await file.read(templatePath);
+  if (!typescript) {
+    const config = await file.exists(path.join(directory, "jsconfig.json")) ? await import(path.join(directory, "jsconfig.json")) : {
+      lib: ["DOM", "DOM.Iterable", "ES2022"],
+      isolatedModules: true,
+      esModuleInterop: true,
+      resolveJsonModule: true,
+      target: "ES2022",
+      strict: true,
+      allowJs: true,
+      forceConsistentCasingInFileNames: true,
+      skipLibCheck: true
+    };
+    const withArtificialNewLines = escapeNewLines(templateContent);
+    const compiled = compile(withArtificialNewLines, config);
+    templateContent = restoreNewLines(compiled.outputText);
+  }
+  if (adapter) {
+    templateContent = templateContent.replace(
+      /@shopify\/remix-oxygen/g,
+      adapter
+    );
+  }
+  templateContent = await format(templateContent, destinationPath);
+  if (!await file.exists(path.dirname(destinationPath))) {
+    await file.mkdir(path.dirname(destinationPath));
+  }
+  await file.write(destinationPath, templateContent);
+  return {
+    operation: "generated"
+  };
+}
+const escapeNewLines = (code) => code.replace(/\n\n/g, "\n/* :newline: */");
+const restoreNewLines = (code) => code.replace(/\/\* :newline: \*\//g, "\n");
+function compile(code, options = {}) {
+  return ts.transpileModule(code, {
+    reportDiagnostics: false,
+    compilerOptions: {
+      ...options,
+      jsx: 1,
+      removeComments: false
+    }
+  });
+}
+async function format(content, filePath) {
+  const config = await prettier.resolveConfig(filePath) || {};
+  const ext = path.extname(filePath);
+  const formattedContent = await prettier.format(content, {
+    parser: ext === ".tsx" || ext === ".ts" ? "typescript" : "babel",
+    ...config
+  });
+  return formattedContent;
+}
+
+export { GenerateRoute as default, runGenerate };

package/dist/commands/hydrogen/generate/route.test.js

@@ -0,0 +1,121 @@
+import { describe, beforeEach, vi, it, expect } from 'vitest';
+import { temporaryDirectoryTask } from 'tempy';
+import { runGenerate } from './route.js';
+import { file, path, ui } from '@shopify/cli-kit';
+
+describe("generate/route", () => {
+  beforeEach(() => {
+    vi.resetAllMocks();
+    vi.mock("@shopify/cli-kit", async () => {
+      const cliKit = await vi.importActual("@shopify/cli-kit");
+      return {
+        ...cliKit,
+        output: {
+          ...cliKit.output,
+          success: vi.fn()
+        },
+        ui: {
+          prompt: vi.fn()
+        }
+      };
+    });
+  });
+  it("generates a route file", async () => {
+    await temporaryDirectoryTask(async (tmpDir) => {
+      const route = "pages/$pageHandle";
+      const { appRoot, templatesRoot } = await createHydrogen(tmpDir, {
+        files: [],
+        templates: [[route, 'const str = "hello world"']]
+      });
+      await runGenerate(route, {
+        directory: appRoot,
+        templatesRoot
+      });
+      expect(
+        await file.read(path.join(appRoot, "app/routes", `${route}.jsx`))
+      ).toContain('const str = "hello world"');
+    });
+  });
+  it("produces a typescript file when typescript argument is true", async () => {
+    await temporaryDirectoryTask(async (tmpDir) => {
+      const route = "pages/$pageHandle";
+      const { appRoot, templatesRoot } = await createHydrogen(tmpDir, {
+        files: [],
+        templates: [[route, 'const str = "hello typescript"']]
+      });
+      await runGenerate(route, {
+        directory: appRoot,
+        templatesRoot,
+        typescript: true
+      });
+      expect(
+        await file.read(path.join(appRoot, "app/routes", `${route}.tsx`))
+      ).toContain('const str = "hello typescript"');
+    });
+  });
+  it("prompts the user if there the file already exists", async () => {
+    await temporaryDirectoryTask(async (tmpDir) => {
+      vi.mocked(ui.prompt).mockImplementationOnce(async () => {
+        return { value: "overwrite" };
+      });
+      const route = "page/$pageHandle";
+      const { appRoot, templatesRoot } = await createHydrogen(tmpDir, {
+        files: [[`app/routes/${route}.jsx`, 'const str = "I exist"']],
+        templates: [[route, 'const str = "hello world"']]
+      });
+      await runGenerate(route, {
+        directory: appRoot,
+        templatesRoot
+      });
+      expect(ui.prompt).toHaveBeenCalledWith(
+        expect.arrayContaining([
+          expect.objectContaining({
+            message: expect.stringContaining("already exists")
+          })
+        ])
+      );
+    });
+  });
+  it("does not prompt the user if the force property is true", async () => {
+    await temporaryDirectoryTask(async (tmpDir) => {
+      vi.mocked(ui.prompt).mockImplementationOnce(async () => {
+        return { value: "overwrite" };
+      });
+      const route = "page/$pageHandle";
+      const { appRoot, templatesRoot } = await createHydrogen(tmpDir, {
+        files: [[`app/routes/${route}.jsx`, 'const str = "I exist"']],
+        templates: [[route, 'const str = "hello world"']]
+      });
+      await runGenerate(route, {
+        directory: appRoot,
+        templatesRoot,
+        force: true
+      });
+      expect(ui.prompt).not.toHaveBeenCalled();
+    });
+  });
+});
+async function createHydrogen(directory, {
+  files,
+  templates
+} = {
+  files: [],
+  templates: []
+}) {
+  for (const item of files) {
+    const [filePath, fileContent] = item;
+    const fullFilePath = path.join(directory, "app", filePath);
+    await file.mkdir(path.dirname(fullFilePath));
+    await file.write(fullFilePath, fileContent);
+  }
+  for (const item of templates) {
+    const [filePath, fileContent] = item;
+    const fullFilePath = path.join(directory, "templates", `${filePath}.tsx`);
+    await file.mkdir(path.dirname(fullFilePath));
+    await file.write(fullFilePath, fileContent);
+  }
+  return {
+    appRoot: path.join(directory, "app"),
+    templatesRoot: directory
+  };
+}

package/dist/commands/hydrogen/init.js

@@ -1,6 +1,5 @@
-import { cli } from '@remix-run/dev';
 import Command from '@shopify/cli-kit/node/base-command';
-import { Flags } from '@oclif/core';
+import Flags from '@oclif/core/lib/flags.js';
 
 class Init extends Command {
   static description = "Creates a new Hydrogen storefront project";
@@ -24,7 +23,7 @@ class Init extends Command {
     await runInit({ ...flags });
   }
 }
-function runInit({
+async function runInit({
   template,
   typescript,
   token
@@ -33,9 +32,10 @@ function runInit({
     "--template",
     template,
     "--install",
-    typescript ? "--typescript" : "",
+    typescript ? "--typescript" : "--no-typescript",
     token ? `--token ${token}` : ""
   ];
+  const { cli } = await import('@remix-run/dev');
   cli.run(["create", ...defaults]);
 }
 

package/dist/commands/hydrogen/preview.js

@@ -1,18 +1,18 @@
 import Command from '@shopify/cli-kit/node/base-command';
 import { muteDevLogs } from '../../utils/log.js';
 import { getProjectPaths } from '../../utils/config.js';
-import { flags } from '../../utils/flags.js';
+import { commonFlags } from '../../utils/flags.js';
 import { startMiniOxygen } from '../../utils/mini-oxygen.js';
 
 class Preview extends Command {
   static description = "Runs an existing Hydrogen storefront build in a MiniOxygen worker";
   static flags = {
-    paths: flags.path,
-    port: flags.port
+    paths: commonFlags.path,
+    port: commonFlags.port
   };
   async run() {
-    const { flags: flags2 } = await this.parse(Preview);
-    await runPreview({ ...flags2 });
+    const { flags } = await this.parse(Preview);
+    await runPreview({ ...flags });
   }
 }
 async function runPreview({
@@ -21,8 +21,8 @@ async function runPreview({
 }) {
   if (!process.env.NODE_ENV)
     process.env.NODE_ENV = "production";
-  const { root, buildPathWorkerFile, buildPathClient } = getProjectPaths(appPath);
   muteDevLogs({ workerReload: false });
+  const { root, buildPathWorkerFile, buildPathClient } = getProjectPaths(appPath);
   await startMiniOxygen({
     root,
     port,

package/dist/hooks/init.js

@@ -3,10 +3,7 @@ import { output } from '@shopify/cli-kit';
 
 const EXPERIMENTAL_VM_MODULES_FLAG = "--experimental-vm-modules";
 const hook = async function(options) {
-  if (!options.id || !["hydrogen:dev", "hydrogen:preview"].includes(options.id)) {
-    return;
-  }
-  if (!process.execArgv.includes(EXPERIMENTAL_VM_MODULES_FLAG) && !(process.env.NODE_OPTIONS ?? "").includes(EXPERIMENTAL_VM_MODULES_FLAG)) {
+  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(
       `Restarting CLI process with ${EXPERIMENTAL_VM_MODULES_FLAG} flag.`
     );