fix(@angular/build): allow direct bundling of TSX files with application builder

packages/angular/build/src/builders/application/tests/behavior/typescript-isolated-modules_spec.ts

@@ -47,5 +47,33 @@ describeBuilder(buildApplication, APPLICATION_BUILDER_INFO, (harness) => {
 
       expect(result?.success).toBe(true);
     });
+
+    it('supports TSX files with isolated modules enabled and enabled optimizations', async () => {
+      // Enable tsconfig isolatedModules option in tsconfig
+      await harness.modifyFile('tsconfig.json', (content) => {
+        const tsconfig = JSON.parse(content);
+        tsconfig.compilerOptions.isolatedModules = true;
+        tsconfig.compilerOptions.jsx = 'react-jsx';
+
+        return JSON.stringify(tsconfig);
+      });
+
+      await harness.writeFile('src/types.d.ts', `declare module 'react/jsx-runtime' { jsx: any }`);
+      await harness.writeFile('src/abc.tsx', `export function hello() { return <h1>Hello</h1>; }`);
+      await harness.modifyFile(
+        'src/main.ts',
+        (content) => content + `import { hello } from './abc'; console.log(hello());`,
+      );
+
+      harness.useTarget('build', {
+        ...BASE_OPTIONS,
+        optimization: true,
+        externalDependencies: ['react'],
+      });
+
+      const { result } = await harness.executeOnce();
+
+      expect(result?.success).toBe(true);
+    });
   });
 });

packages/angular/build/src/tools/esbuild/angular/compiler-plugin.ts

@@ -8,6 +8,7 @@
 
 import type {
   BuildFailure,
+  Loader,
   Metafile,
   OnStartResult,
   OutputFile,
@@ -456,9 +457,21 @@ export function createCompilerPlugin(
           typeScriptFileCache.set(request, contents);
         }
 
+        let loader: Loader;
+        if (useTypeScriptTranspilation || isJS) {
+          // TypeScript has transpiled to JS or is already JS
+          loader = 'js';
+        } else if (request.at(-1) === 'x') {
+          // TSX and TS have different syntax rules. Only set if input is a TSX file.
+          loader = 'tsx';
+        } else {
+          // Otherwise, directly bundle TS
+          loader = 'ts';
+        }
+
         return {
           contents,
-          loader: useTypeScriptTranspilation || isJS ? 'js' : 'ts',
+          loader,
         };
       });