feat(deploy): target support for multi-site deploy options (#2726)

Author: hiepxanh

docs/deploy/getting-started.md

@@ -140,4 +140,65 @@ The above configuration specifies the following:
 2. `ng deploy projectName` will deploy the specified project with default configuration.
 3. `ng deploy projectName --prod` or `ng deploy projectName --configuration='production'` will deploy `projectName` with production build settings to your production environment.
 
-All of the options are optional. If you do not specify a `buildTarget`, it defaults to a production build (`projectName:build:production`). If you do not specify a `firebaseProject`, it defaults to the first matching deploy target found in your `.firebaserc` (where your projectName is the same as your Firebase deploy target name). The `configurations` section is also optional.
+All of the options are optional. If you do not specify a `buildTarget`, it defaults to a production build (`projectName:build:production`). If you do not specify a `firebaseProject`, it defaults to the first matching deploy target found in your `.firebaserc` (where your projectName is the same as your Firebase deploy target name). The `configurations` section is also optional.
+
+### Working with multiple project sites
+
+For example, if you have muti sites config in firebase.json like this:
+```
+{
+  "hosting": [
+    {
+      "target": "custom-site",
+      "public": "public/my-custom-site",
+      "ignore": [
+        "firebase.json",
+        "**/.*",
+        "**/node_modules/**"
+      ],
+      "rewrites": [
+        {
+          "source": "**",
+          "destination": "/index.html"
+        }
+      ]
+    }
+  ],
+```
+
+If you have multiple build targets and deploy targets, it is possible to specify them in your `angular.json` or `workspace.json`.
+
+It is possible to use either your project name or project alias in `siteTarget`.
+
+You may specify a `siteTarget` in your `options` as follows:
+
+```json
+"deploy": {
+    "builder": "@angular/fire:deploy",
+    "options": {
+        "buildTarget": "projectName:build",
+        "firebaseProject": "developmentProject",
+        "siteTarget": "yourDefaultSiteTarget"
+    },
+    "configurations": {
+        "production": {
+            "buildTarget": "projectName:build:production",
+            "firebaseProject": "productionProject",
+            "siteTarget": "yourProdSiteTarget"
+        },
+        "storybook": {
+            "buildTarget": "projectName:build-storybook",
+            "firebaseProject": "developmentProject",
+            "siteTarget": "yourStorybookSiteTarget"
+        }
+    }
+}
+```
+
+The above configuration specifies the following:
+
+1. `ng deploy` will deploy the default project with default configuration.
+2. `ng deploy projectName` will deploy the specified project with default configuration.
+3. `ng deploy projectName --configuration=storybook --siteTarget=mySiteTarget` will deploy `projectName` to `mySiteTarget` with configuration`storybook`.
+
+All of the options are optional

src/schematics/deploy/actions.ts

@@ -70,14 +70,16 @@ const deployToHosting = async (
   options: DeployBuilderOptions,
   firebaseToken?: string,
 ) => {
+  
+  // tslint:disable-next-line:no-non-null-assertion
+  const siteTarget = options.target ?? context.target!.project;
 
   if (options.preview) {
 
     await firebaseTools.serve({
       port: DEFAULT_EMULATOR_PORT,
       host: DEFAULT_EMULATOR_HOST,
-      // tslint:disable-next-line:no-non-null-assertion
-      targets: [`hosting:${context.target!.project}`],
+      targets: [`hosting:${siteTarget}`],
       nonInteractive: true,
       projectRoot: workspaceRoot,
     });
@@ -93,8 +95,7 @@ const deployToHosting = async (
   }
 
   return await firebaseTools.deploy({
-    // tslint:disable-next-line:no-non-null-assertion
-    only: 'hosting:' + context.target!.project,
+    only: `hosting:${siteTarget}`,
     cwd: workspaceRoot,
     token: firebaseToken,
     nonInteractive: true,
@@ -222,14 +223,14 @@ export const deployToFunction = async (
   }
 
   // tslint:disable-next-line:no-non-null-assertion
-  const project = context.target!.project;
+  const siteTarget = options.target ?? context.target!.project;
 
   if (options.preview) {
 
     await firebaseTools.serve({
       port: DEFAULT_EMULATOR_PORT,
       host: DEFAULT_EMULATOR_HOST,
-      targets: [`hosting:${project}`, `functions:${functionName}`],
+      targets: [`hosting:${siteTarget}`, `functions:${functionName}`],
       nonInteractive: true,
       projectRoot: workspaceRoot,
     });
@@ -244,7 +245,7 @@ export const deployToFunction = async (
   }
 
   return await firebaseTools.deploy({
-    only: `hosting:${project},functions:${functionName}`,
+    only: `hosting:${siteTarget},functions:${functionName}`,
     cwd: workspaceRoot,
     token: firebaseToken,
     nonInteractive: true,
@@ -349,10 +350,12 @@ export const deployToCloudRun = async (
   await spawnAsync(`gcloud builds submit ${cloudRunOut} --tag gcr.io/${options.firebaseProject}/${serviceId} --project ${options.firebaseProject} --quiet`);
   await spawnAsync(`gcloud run deploy ${serviceId} --image gcr.io/${options.firebaseProject}/${serviceId} --project ${options.firebaseProject} ${deployArguments.join(' ')} --platform managed --allow-unauthenticated --region=${options.region} --quiet`);
 
+  // tslint:disable-next-line:no-non-null-assertion
+  const siteTarget = options.target ?? context.target!.project;
+  
   // TODO deploy cloud run
   return await firebaseTools.deploy({
-    // tslint:disable-next-line:no-non-null-assertion
-    only: `hosting:${context.target!.project}`,
+    only: `hosting:${siteTarget}`,
     cwd: workspaceRoot,
     token: firebaseToken,
     nonInteractive: true,

src/schematics/deploy/schema.json

@@ -41,6 +41,10 @@
       "type": "string",
       "description": "The Firebase project name or project alias to use when deploying"
     },
+    "target": {
+      "type": "string",
+      "description": "The Firebase hosting target in firebase.json for multi-site"
+    },
     "firebaseHostingSite": {
       "type": "string",
       "description": "The Firebase Hosting site to deploy to"

src/schematics/interfaces.ts

@@ -166,6 +166,7 @@ export interface DeployBuilderSchema {
   firebaseProject?: string;
   firebaseHostingSite?: string;
   preview?: boolean;
+  target?: boolean;
   universalBuildTarget?: string;
   serverTarget?: string;
   prerenderTarget?: string;