Add --codegen-unstable flag to build command (#1049)

* Minor codegen refactor * Add --codegen-unstable flag to build command * Maybe fix not found queries issue from monorepo * Changesets
Shopify · Jun 28, 2023 · 00f3e59 · 00f3e59
1 parent 2d63d86
commit 00f3e59
Show file tree

Hide file tree

Showing 8 changed files with 82 additions and 65 deletions.
diff --git a/.changeset/smooth-colts-reflect.md b/.changeset/smooth-colts-reflect.md
@@ -0,0 +1,5 @@
+---
+'@shopify/cli-hydrogen': patch
+---
+
+Add `--codegen-unstable` flag to `build` command.
diff --git a/packages/cli/oclif.manifest.json b/packages/cli/oclif.manifest.json
diff --git a/packages/cli/src/commands/hydrogen/build.ts b/packages/cli/src/commands/hydrogen/build.ts
@@ -25,6 +25,7 @@ import {deprecated, commonFlags, flagsToCamelObject} from '../../lib/flags.js';
 import {checkLockfileStatus} from '../../lib/check-lockfile.js';
 import {findMissingRoutes} from '../../lib/missing-routes.js';
 import {warnOnce} from '../../lib/log.js';
+import {codegen} from '../../lib/codegen.js';
 
 const LOG_WORKER_BUILT = '📦 Worker built';
 
@@ -41,6 +42,14 @@ export default class Build extends Command {
       description: 'Disable warning about missing standard routes.',
       env: 'SHOPIFY_HYDROGEN_FLAG_DISABLE_ROUTE_WARNING',
     }),
+    ['codegen-unstable']: Flags.boolean({
+      description:
+        'Generate types for the Storefront API queries found in your project.',
+      required: false,
+      default: false,
+    }),
+    ['codegen-config-path']: commonFlags.codegenConfigPath,
+
     base: deprecated('--base')(),
     entry: deprecated('--entry')(),
     target: deprecated('--target')(),
@@ -50,16 +59,24 @@ export default class Build extends Command {
     const {flags} = await this.parse(Build);
     const directory = flags.path ? resolvePath(flags.path) : process.cwd();
 
-    await runBuild({...flagsToCamelObject(flags), path: directory});
+    await runBuild({
+      ...flagsToCamelObject(flags),
+      useCodegen: flags['codegen-unstable'],
+      path: directory,
+    });
   }
 }
 
 export async function runBuild({
   path: appPath,
+  useCodegen = false,
+  codegenConfigPath,
   sourcemap = false,
   disableRouteWarning = false,
 }: {
   path?: string;
+  useCodegen?: boolean;
+  codegenConfigPath?: string;
   sourcemap?: boolean;
   disableRouteWarning?: boolean;
 }) {
@@ -99,6 +116,7 @@ export async function runBuild({
       logThrown(thrown);
       process.exit(1);
     }),
+    useCodegen && codegen({...remixConfig, configFilePath: codegenConfigPath}),
   ]);
 
   if (process.env.NODE_ENV !== 'development') {

diff --git a/packages/cli/src/commands/hydrogen/codegen-unstable.ts b/packages/cli/src/commands/hydrogen/codegen-unstable.ts
@@ -1,15 +1,10 @@
 import path from 'path';
 import Command from '@shopify/cli-kit/node/base-command';
-import {AbortError} from '@shopify/cli-kit/node/error';
 import {renderSuccess} from '@shopify/cli-kit/node/ui';
 import {Flags} from '@oclif/core';
 import {getProjectPaths, getRemixConfig} from '../../lib/config.js';
 import {commonFlags, flagsToCamelObject} from '../../lib/flags.js';
-import {
-  generateTypes,
-  normalizeCodegenError,
-  patchGqlPluck,
-} from '../../lib/codegen.js';
+import {codegen} from '../../lib/codegen.js';
 
 export default class Codegen extends Command {
   static description =
@@ -45,7 +40,7 @@ export default class Codegen extends Command {
   }
 }
 
-async function runCodegen({
+export async function runCodegen({
   path: appPath,
   codegenConfigPath,
   forceSfapiVersion,
@@ -59,30 +54,19 @@ async function runCodegen({
   const {root} = getProjectPaths(appPath);
   const remixConfig = await getRemixConfig(root);
 
-  await patchGqlPluck();
+  console.log(''); // New line
 
-  try {
-    const generatedFiles = await generateTypes({
-      ...remixConfig,
-      configFilePath: codegenConfigPath,
-      forceSfapiVersion,
-      watch,
-    });
-
-    if (!watch) {
-      console.log('');
-      renderSuccess({
-        headline: 'Generated types for GraphQL:',
-        body: generatedFiles.map((file) => `- ${file}`).join('\n'),
-      });
-    }
-  } catch (error) {
-    const {message, details} = normalizeCodegenError(
-      (error as Error).message,
-      remixConfig.rootDirectory,
-    );
+  const generatedFiles = await codegen({
+    ...remixConfig,
+    configFilePath: codegenConfigPath,
+    forceSfapiVersion,
+    watch,
+  });
 
-    console.log('');
-    throw new AbortError(message, details);
+  if (!watch) {
+    renderSuccess({
+      headline: 'Generated types for GraphQL:',
+      body: generatedFiles.map((file) => `- ${file}`).join('\n'),
+    });
   }
 }
diff --git a/packages/cli/src/commands/hydrogen/dev.ts b/packages/cli/src/commands/hydrogen/dev.ts
@@ -36,12 +36,7 @@ export default class Dev extends Command {
       required: false,
       default: false,
     }),
-    ['codegen-config-path']: Flags.string({
-      description:
-        'Specify a path to a codegen configuration file. Defaults to `<root>/codegen.ts` if it exists.',
-      required: false,
-      dependsOn: ['codegen-unstable'],
-    }),
+    ['codegen-config-path']: commonFlags.codegenConfigPath,
     sourcemap: commonFlags.sourcemap,
     'disable-virtual-routes': Flags.boolean({
       description:
@@ -65,7 +60,7 @@ export default class Dev extends Command {
 
     await runDev({
       ...flagsToCamelObject(flags),
-      codegen: flags['codegen-unstable'],
+      useCodegen: flags['codegen-unstable'],
       path: directory,
     });
   }
@@ -74,7 +69,7 @@ export default class Dev extends Command {
 async function runDev({
   port,
   path: appPath,
-  codegen = false,
+  useCodegen = false,
   codegenConfigPath,
   disableVirtualRoutes,
   shop,
@@ -84,7 +79,7 @@ async function runDev({
 }: {
   port?: number;
   path?: string;
-  codegen?: boolean;
+  useCodegen?: boolean;
   codegenConfigPath?: string;
   disableVirtualRoutes?: boolean;
   shop?: string;
@@ -167,7 +162,7 @@ async function runDev({
 
   const remixConfig = await reloadConfig();
 
-  if (codegen) {
+  if (useCodegen) {
     spawnCodegenProcess({...remixConfig, configFilePath: codegenConfigPath});
   }
 

diff --git a/packages/cli/src/lib/codegen.ts b/packages/cli/src/lib/codegen.ts
@@ -11,31 +11,25 @@ import {
 } from '@shopify/hydrogen-codegen';
 import {format, resolveFormatConfig} from './transpile-ts.js';
 import {renderFatalError, renderWarning} from '@shopify/cli-kit/node/ui';
-import {joinPath, relativePath} from '@shopify/cli-kit/node/path';
+import {joinPath} from '@shopify/cli-kit/node/path';
+import {AbortError} from '@shopify/cli-kit/node/error';
 import {spawn} from 'node:child_process';
 import {fileURLToPath} from 'node:url';
 
-export {patchGqlPluck} from '@shopify/hydrogen-codegen';
-
 const nodePath = process.argv[1];
 const modulePath = fileURLToPath(import.meta.url);
 const isStandaloneProcess = nodePath === modulePath;
 
 if (isStandaloneProcess) {
-  patchGqlPluck().then(() =>
-    generateTypes({
-      rootDirectory: process.argv[2]!,
-      appDirectory: process.argv[3]!,
-      configFilePath: process.argv[4],
-      watch: true,
-    }),
-  );
+  codegen({
+    rootDirectory: process.argv[2]!,
+    appDirectory: process.argv[3]!,
+    configFilePath: process.argv[4],
+    watch: true,
+  });
 }
 
-export function normalizeCodegenError(
-  errorMessage: string,
-  rootDirectory?: string,
-) {
+function normalizeCodegenError(errorMessage: string, rootDirectory?: string) {
   const [first = '', ...rest] = errorMessage
     .replaceAll('[FAILED]', '')
     .replace(/\s{2,}/g, '\n')
@@ -115,7 +109,22 @@ type CodegenOptions = ProjectDirs & {
   forceSfapiVersion?: string;
 };
 
-export async function generateTypes({
+export async function codegen(options: CodegenOptions) {
+  await patchGqlPluck();
+
+  try {
+    return await generateTypes(options);
+  } catch (error) {
+    const {message, details} = normalizeCodegenError(
+      (error as Error).message,
+      options.rootDirectory,
+    );
+
+    throw new AbortError(message, details);
+  }
+}
+
+async function generateTypes({
   watch,
   configFilePath,
   forceSfapiVersion,
@@ -152,7 +161,6 @@ function generateDefaultConfig(
   forceSfapiVersion?: string,
 ): LoadCodegenConfigResult {
   const tsDefaultGlob = '*!(*.d).{ts,tsx}'; // No d.ts files
-  const appDirRelative = relativePath(rootDirectory, appDirectory);
 
   return {
     filepath: 'virtual:codegen',
@@ -164,8 +172,8 @@ function generateDefaultConfig(
           preset,
           schema,
           documents: [
-            tsDefaultGlob, // E.g. ./server.ts
-            joinPath(appDirRelative, '**', tsDefaultGlob), // E.g. app/routes/_index.tsx
+            joinPath(rootDirectory, tsDefaultGlob), // E.g. ./server.ts
+            joinPath(appDirectory, '**', tsDefaultGlob), // E.g. app/routes/_index.tsx
           ],
 
           ...(!!forceSfapiVersion && {

diff --git a/packages/cli/src/lib/flags.ts b/packages/cli/src/lib/flags.ts
@@ -41,6 +41,12 @@ export const commonFlags = {
     default: true,
     allowNo: true,
   }),
+  codegenConfigPath: Flags.string({
+    description:
+      'Specify a path to a codegen configuration file. Defaults to `<root>/codegen.ts` if it exists.',
+    required: false,
+    dependsOn: ['codegen-unstable'],
+  }),
 };
 
 export function flagsToCamelObject(obj: Record<string, any>) {

diff --git a/packages/cli/src/lib/transpile-ts.ts b/packages/cli/src/lib/transpile-ts.ts
@@ -195,11 +195,12 @@ export async function transpileProject(projectDir: string) {
       }
     }
 
+    const codegenFlag = /\s*--codegen(-unstable)?/;
     if (pkgJson.scripts?.dev) {
-      pkgJson.scripts.dev = pkgJson.scripts.dev.replace(
-        /\s*--codegen(-unstable)?/,
-        '',
-      );
+      pkgJson.scripts.dev = pkgJson.scripts.dev.replace(codegenFlag, '');
+    }
+    if (pkgJson.scripts?.build) {
+      pkgJson.scripts.build = pkgJson.scripts.build.replace(codegenFlag, '');
     }
 
     await fs.writeFile(