Angular v17 support

CHANGELOG.md

@@ -0,0 +1 @@
+- Added the ability to deploy Angular apps using [the new application-builder](https://angular.dev/tools/cli/esbuild). (#6480)

src/frameworks/angular/index.ts

@@ -11,7 +11,6 @@
   SupportLevel,
   BUILD_TARGET_PURPOSE,
 } from "../interfaces";
-import { promptOnce } from "../../prompt";
 import {
   simpleProxy,
   relativeRequire,
@@ -36,41 +35,30 @@
 
 const DEFAULT_BUILD_SCRIPT = ["ng build"];
 
 export async function discover(dir: string): Promise<Discovery | undefined> {
   if (!(await pathExists(join(dir, "package.json")))) return;
   if (!(await pathExists(join(dir, "angular.json")))) return;
   return { mayWantBackend: true, publicDirectory: join(dir, "src", "assets") };
 }
 
-export async function init(setup: any, config: any) {
+export function init(setup: any, config: any) {
   execSync(
     `npx --yes -p @angular/cli@latest ng new ${setup.projectId} --directory ${setup.hosting.source} --skip-git`,
     {
       stdio: "inherit",
       cwd: config.projectDir,
     }
   );
-  const useAngularUniversal = await promptOnce({
-    name: "useAngularUniversal",
-    type: "confirm",
-    default: false,
-    message: `Would you like to setup Angular Universal?`,
-  });
-  if (useAngularUniversal) {
-    execSync("ng add @nguniversal/express-engine --skip-confirmation", {
-      stdio: "inherit",
-      cwd: join(config.projectDir, setup.hosting.source),
-    });
-  }
+  return Promise.resolve();
 }
 
 export async function build(dir: string, configuration: string): Promise<BuildResult> {
   const {
     targets,
-    serverTarget,
     serveOptimizedImages,
     locales,
     baseHref: baseUrl,
+    ssr,
   } = await getBuildConfig(dir, configuration);
   await warnIfCustomBuildScript(dir, name, DEFAULT_BUILD_SCRIPT);
   for (const target of targets) {
@@ -84,8 +72,8 @@
     if (result.status !== 0) throw new FirebaseError(`Unable to build ${target}`);
   }
 
-  const wantsBackend = !!serverTarget || serveOptimizedImages;
-  const rewrites = serverTarget
+  const wantsBackend = ssr || serveOptimizedImages;
+  const rewrites = ssr
     ? []
     : [
         {
@@ -149,8 +137,12 @@
 export async function getValidBuildTargets(purpose: BUILD_TARGET_PURPOSE, dir: string) {
   const validTargetNames = new Set(["development", "production"]);
   try {
-    const { workspaceProject, browserTarget, serverTarget, serveTarget } = await getContext(dir);
-    const { target } = ((purpose === "emulate" && serveTarget) || serverTarget || browserTarget)!;
+    const { workspaceProject, buildTarget, browserTarget, prerenderTarget, serveTarget } =
+      await getContext(dir);
+    const { target } = ((purpose === "emulate" && serveTarget) ||
+      buildTarget ||
+      prerenderTarget ||
+      browserTarget)!;
     const workspaceTarget = workspaceProject.targets.get(target)!;
     Object.keys(workspaceTarget.configurations || {}).forEach((it) => validTargetNames.add(it));
   } catch (e) {
@@ -182,6 +174,7 @@
     externalDependencies,
     baseHref,
     serveOptimizedImages,
+    serverEntry,
   } = await getServerConfig(sourceDir, configuration);
 
   const dotEnv = { __NG_BROWSER_OUTPUT_PATH__: browserOutputPath };
@@ -232,14 +225,25 @@
     if (localizedApps.has(locale)) {
       localizedApps.get(locale)(req,res);
     } else {
-      const app = require(\`./${serverOutputPath}/\${locale}/main.js\`).app(locale);
-      localizedApps.set(locale, app);
-      app(req,res);
+      ${
+        serverEntry?.endsWith(".mjs")
+          ? `import(\`./${serverOutputPath}/\${locale}/${serverEntry}\`)`
+          : `Promise.resolve(require(\`./${serverOutputPath}/\${locale}/${serverEntry}\`))`
+      }.then(server => {
+        const app = server.app(locale);
+        localizedApps.set(locale, app);
+        app(req,res);
+      });
     }
   });
 };\n`;
   } else if (serverOutputPath) {
-    bootstrapScript = `exports.handle = require('./${serverOutputPath}/main.js').app();\n`;
+    bootstrapScript = `const app = ${
+      serverEntry?.endsWith(".mjs")
+        ? `import(\`./${serverOutputPath}/${serverEntry}\`)`
+        : `Promise.resolve(require('./${serverOutputPath}/${serverEntry}'))`
+    }.then(server => server.app());
+exports.handle = (req,res) => app.then(it => it(req,res));\n`;
   } else {
     bootstrapScript = `exports.handle = (res, req) => req.sendStatus(404);\n`;
     rewriteSource = posix.join(baseHref, "__image__");