fix(remix): the output path should respect the remix.config.js in crystal (#21842)

e2e/remix/tests/nx-remix.test.ts

@@ -47,7 +47,7 @@ describe('Remix E2E Tests', () => {
         expect(result).toContain('Successfully ran target build');
 
         // TODO(colum): uncomment line below when fixed
-        checkFilesExist(`dist/apps/sub/${plugin}/build/index.js`);
+        checkFilesExist(`apps/sub/${plugin}/build/index.js`);
       }, 120000);
 
       it('should create src in the specified directory --projectNameAndRootFormat=as-provided', async () => {
@@ -58,7 +58,7 @@ describe('Remix E2E Tests', () => {
 
         const result = runCLI(`build ${plugin}`);
         expect(result).toContain('Successfully ran target build');
-        checkFilesExist(`dist/subdir/build/index.js`);
+        checkFilesExist(`subdir/build/index.js`);
       }, 120000);
     });
 

packages/remix/src/plugins/__snapshots__/plugin.spec.ts.snap

@@ -17,10 +17,11 @@ exports[`@nx/remix/plugin non-root project should create nodes 1`] = `
             "^production",
           ],
           "options": {
-            "outputPath": "{workspaceRoot}/dist/my-app",
+            "outputPath": "my-app",
           },
           "outputs": [
-            "{options.outputPath}",
+            "{workspaceRoot}/my-app/build",
+            "{workspaceRoot}/my-app/public/build",
           ],
         },
         "serve": {
@@ -72,10 +73,11 @@ exports[`@nx/remix/plugin root project should create nodes 1`] = `
             "^production",
           ],
           "options": {
-            "outputPath": "{workspaceRoot}/dist",
+            "outputPath": ".",
           },
           "outputs": [
-            "{options.outputPath}",
+            "{workspaceRoot}/build",
+            "{workspaceRoot}/public/build",
           ],
         },
         "serve": {

packages/remix/src/plugins/plugin.ts

@@ -4,6 +4,7 @@ import {
   type CreateNodes,
   type CreateNodesContext,
   detectPackageManager,
+  joinPathFragments,
   readJsonFile,
   type TargetConfiguration,
   writeJsonFile,
@@ -98,15 +99,15 @@ async function buildRemixTargets(
   siblingFiles: string[]
 ) {
   const namedInputs = getNamedInputs(projectRoot, context);
-  const serverBuildPath = await getServerBuildPath(
-    configFilePath,
-    context.workspaceRoot
-  );
+  const { buildDirectory, assetsBuildDirectory, serverBuildPath } =
+    await getBuildPaths(configFilePath, context.workspaceRoot);
 
   const targets: Record<string, TargetConfiguration> = {};
   targets[options.buildTargetName] = buildTarget(
     options.buildTargetName,
     projectRoot,
+    buildDirectory,
+    assetsBuildDirectory,
     namedInputs
   );
   targets[options.serveTargetName] = serveTarget(serverBuildPath);
@@ -127,9 +128,20 @@ async function buildRemixTargets(
 function buildTarget(
   buildTargetName: string,
   projectRoot: string,
+  buildDirectory: string,
+  assetsBuildDirectory: string,
   namedInputs: { [inputName: string]: any[] }
 ): TargetConfiguration {
-  const pathToOutput = projectRoot === '.' ? '' : `/${projectRoot}`;
+  const serverBuildOutputPath =
+    projectRoot === '.'
+      ? joinPathFragments(`{workspaceRoot}`, buildDirectory)
+      : joinPathFragments(`{workspaceRoot}`, projectRoot, buildDirectory);
+
+  const assetsBuildOutputPath =
+    projectRoot === '.'
+      ? joinPathFragments(`{workspaceRoot}`, assetsBuildDirectory)
+      : joinPathFragments(`{workspaceRoot}`, projectRoot, assetsBuildDirectory);
+
   return {
     cache: true,
     dependsOn: [`^${buildTargetName}`],
@@ -138,10 +150,10 @@ function buildTarget(
         ? ['production', '^production']
         : ['default', '^default']),
     ],
-    outputs: ['{options.outputPath}'],
+    outputs: [serverBuildOutputPath, assetsBuildOutputPath],
     executor: '@nx/remix:build',
     options: {
-      outputPath: `{workspaceRoot}/dist${pathToOutput}`,
+      outputPath: projectRoot,
     },
   };
 }
@@ -192,13 +204,21 @@ function typecheckTarget(
   };
 }
 
-async function getServerBuildPath(
+async function getBuildPaths(
   configFilePath: string,
   workspaceRoot: string
-): Promise<string> {
+): Promise<{
+  buildDirectory: string;
+  assetsBuildDirectory: string;
+  serverBuildPath: string;
+}> {
   const configPath = join(workspaceRoot, configFilePath);
   let appConfig = await loadConfigFile<AppConfig>(configPath);
-  return appConfig.serverBuildPath ?? 'build/index.js';
+  return {
+    buildDirectory: 'build',
+    serverBuildPath: appConfig.serverBuildPath ?? 'build/index.js',
+    assetsBuildDirectory: appConfig.assetsBuildDirectory ?? 'public/build',
+  };
 }
 
 function normalizeOptions(options: RemixPluginOptions) {